I'm building a form that inputs data in a mysql db.
What I want is for a chain select form that is more dynamic and uses ajax.
The tricky part is there are multiple product categories and subcategories, and each subcategory has specs that others do not. So upon selecting a product category, the subcategories for that category appear in another select box, and upon selecting a subcategory, certain input fields show that don't show in other categories.
For example:
If they choose category a, sub_cat1 b, then input fields for spec_a, spec_c, spec_f, etc will show.
If they choose category b, sub_cat1 c, sub_cat2 a, then input fields for spec_a, spec_b, spec_e, etc will show.
Just hoping someone at least understands what I'm asking to do and can point out a tutorial or something close enough to what I'm trying to accomplish.
What I got so far, read my comments.
mysql
Code:
ID, prod_cat, sub_cat1, sub_cat2, model, spec_a, spec_b, spec_c, spec_d, spec_e, spec_f, spec_g
index.html
Code:
<html>
<head>
<script language="javascript">
function update()
{
alert("Database updated.");
window.location.reload(true);
}
</script>
<script language="javascript" src="chain.js"></script>
</head>
<body>
<table>
<form method="post" action="#">
<tr><td>Product Category:
<!-- CATEGORY SELECTION. ?'s BECAUSE THIS IS THE PART I'M TRYING TO FIGURE OUT --!>
<select id="?" name="?">
<option value="?">?</option>
<option name="?" value="?">?</option>
<option name="?" value="?">?</option>
<option name="?" value="?">?</option>
</select>
<!-- AJAX RETURNS ANOTHER SELECT BOX WITH SUBCATEGORIES RELATED TO SELECTED CATEGORY --?>
<select id="?" name="?">
<option value="?">?</option>
<option name="?" value="?">?</option>
<option name="?" value="?">?</option>
<option name="?" value="?">?</option>
</select>
</td></tr>
<!-- AJAX RETURNS CERTAIN INPUT FIELDS DEPENDENT ON SELECTED CATEGORY/SUBCATEGORY --!>
<tr><td>Model#</td><td><input type="text" name="model" /></td></tr>
<tr><td>Specification A<input type="text" name="spec_a" /></td></tr>
<tr><td>Specification B<input type="text" name="spec_b" /></td></tr>
<tr><td>Specification C<input type="text" name="spec_c" /></td></tr>
<tr><td>Specification D<input type="text" name="spec_d" /></td></tr>
<tr><td>Specification E<input type="text" name="spec_e" /></td></tr>
<tr><td>Specification F<input type="text" name="spec_f" /></td></tr>
<tr><td>Specification G<input type="text" name="spec_g" /></td></tr>
</form>
<input type='submit' value="Add Product" />
</table>
</body>
</html>
-----------------------------------------------------------------------
update.php
Code:
<?php
include ('link.php');
$id = $_POST[''];
$prod_cat = $_POST['prod_cat'];
$sub_cat1 = $_POST['sub_cat1'];
$sub_cat2 = $_POST['sub_cat2'];
$model = $_POST['model'];
$spec_a = $_POST['spec_a'];
$spec_b = $_POST['spec_b'];
$spec_b = $_POST['spec_c'];
$spec_b = $_POST['spec_d'];
$spec_b = $_POST['spec_e'];
$spec_b = $_POST['spec_f'];
$query= "INSERT INTO product_specs (ID,
prod_cat,
sub_cat1,
sub_cat2,
model,
spec_a,
spec_b,
spec_c,
spec_d,
spec_e,
spec_f
)
VALUES ('NULL',
'".$prod_cat."',
'".$sub_cat1."',
'".$sub_cat2."',
'".$model."',
'".$spec_a."',
'".$spec_b."',
'".$spec_c."',
'".$spec_d."',
'".$spec_e."',
'".$spec_f."', )
";
mysql_query($query) or die ('Error updating database: ' . mysql_error());
?>