I have a page which is the code I provided. The page has a form. The form has a table row with four input fields. The first field on the page is a drop down box that is populated with data from the database. Once a user selects an option in the first drop down box it will populate the second drop down box with information that corresponds to the selection of the first drop down box. If I leave only these four fields I can get the functionality of the drop down population to work just fine, but what I want to do is have a second table row with a set of fields that are identical to the previous row and for it to have the same functionality of selecting the first drop drop down in that row to populate the second drop down in that row. The issue that I am having is that currently the first drop-down box in the first row populates the data in the second drop-down in the first row via a javascript function that refreshes the page in order for the second drop down to know what is selected. When I select an option in the first drop-down box of the second row or possibly a third row nothing happens. The second drop down box of the second row should populate data with what corresponds to the selection of the first drop-down of the second row.
Essentially I want the user to be able to do what they are doing in the first row over and over again.
<?php
session_start();
include("db_connect.php");
?>
<!doctype html public "-//w3c//dtd html 3.2//en">
<html>
<head>
<title></title>
<SCRIPT language=JavaScript>
function reload(form)
{
var val=form.cat.options[form.cat.options.selectedIndex].value;
self.location='shelf-talker.php?cat=' + val ;
}
</script>
</head>
<body>
<ul>
<li><a href="search.php" target="_self">Update/Delete</a></li>
<li><a href="add-products.php" target="_self">Add Products</a></li>
<li><a href="add-categories.php" target="_self">Add Categories</a></li>
<li><a href="shelf-talker.php" target="_self">Shelf Talker</a></li>
<li><a href="book-page.php" target="_self">Book Page</a></li>
</ul>
<h1>Shelf Talker</h1>
<p>Search Products</p>
<?php echo "<form method=post name=f1 action='shelf-talker-results.php'>"; ?>
<?php
@$cat=$_GET['cat']; // If register_global is off use this
if(strlen($cat) > 0 and !is_numeric($cat)){ // Check if $cat is numeric or not.
echo "Data Error";
exit;
}
// First list box//
$quer2=mysql_query("SELECT product_categories_name, product_categories_id FROM tbl_product_categories");
// End of First list box
//Check if category is selected else we display all the subcategories
if(isset($cat) and strlen($cat) > 0){
$quer=mysql_query("SELECT product_name, product_id, join_category_id, join_product_id FROM tbl_product, tbl_join_products_categories WHERE join_category_id=$cat AND product_id=join_product_id order by product_name");
}
//end of query for second subcategory drop down list box
//Starting of first drop downlist
echo "First Item<br>Category: <select name='cat' onchange=\"reload(form)\"><option value=''>Select one</option>";
while($noticia2 = mysql_fetch_array($quer2)) {
if($noticia2['product_categories_id']==@$cat){echo "<option selected value='$noticia2[product_categories_id]'>$noticia2[product_categories_name]</option>"."<BR>";}
else{echo "<option value='$noticia2[product_categories_id]'>$noticia2[product_categories_name]</option>";}
}
echo "</select>";
//End the first drop down list
//Starting of second drop downlist
echo " Product: <select name='subcat'><option value=''>Select one</option>";
while($noticia = mysql_fetch_array($quer)) {
echo "<option value='".urlencode($noticia["product_name"])."'>".$noticia["product_name"]."</option>";
}
echo "</select>";
//End the second drop down list
echo " Bin #: <input type='text' name='bin' value=''> Price: <input type='text' name='price'> <br><br>";
//Additional fields
?>
<?php
@$second_cat=$_GET['second_cat']; // If register_global is off use this
if(strlen($second_cat) > 0 and !is_numeric($second_cat)){ // Check if $cat is numeric or not.
echo "Data Error";
exit;
}
// First list box//
$second_quer2=mysql_query("SELECT product_categories_name, product_categories_id FROM tbl_product_categories");
// End of First list box
//Check if category is selected else we display all the subcategories
if(isset($second_cat) and strlen($second_cat) > 0){
$second_quer=mysql_query("SELECT product_name, product_id, join_category_id, join_product_id FROM tbl_product, tbl_join_products_categories WHERE join_category_id=$second_cat AND product_id=join_product_id order by product_name");
}
//end of query for second subcategory drop down list box
//Starting of first drop downlist
echo "First Item<br>Category: <select name='second_cat' onchange=\"reload(form)\"><option value=''>Select one</option>";
while($second_noticia2 = mysql_fetch_array($second_quer2)) {
if($second_noticia2['product_categories_id']==@$second_cat){echo "<option selected value='$second_noticia2[product_categories_id]'>$second_noticia2[product_categories_name]</option>"."<BR>";}
else{echo "<option value='$second_noticia2[product_categories_id]'>$second_noticia2[product_categories_name]</option>";}
}
echo "</select>";
//End the first drop down list
//Starting of second drop downlist
echo " Product: <select name='second_subcat'><option value=''>Select one</option>";
while($second_noticia = mysql_fetch_array($second_quer)) {
echo "<option value='".urlencode($second_noticia["product_name"])."'>".$second_noticia["product_name"]."</option>";
}
echo "</select>";
//End the second drop down list
echo " Bin #: <input type='text' name='second_bin' value=''> Price: <input type='text' name='second_price'> <br><br>";
//Additional fields
?>
<?php
echo "<input type=submit value=Submit name=submit>";
echo "</form>";
?>
</body>
</html>