Sorry im a newbie looking for help from experts
what i have is a form to add customer details.
What i am looking is to add:
dropdown list #1 dropdown list #2 data in list#2 to be changed on the base of list#1 using php mysql
i have used a script Demo 3 of Three Multiple drop down list box from plus2net http://www.plus2net.com/php_tutorial/dd3.php
however the issue with this script is that on each selection data for dropdown gets reload in my form and the data i have in other text boxes gets reset
The help will be much appreciated
<?php
require "config.php"; // Your Database details
?>
<html>
<head>
<title>Demo of Three Multiple drop down list box from plus2net</title>
<meta name="GENERATOR" content="Arachnophilia 4.0">
<meta name="FORMATTER" content="Arachnophilia 4.0">
<SCRIPT language=JavaScript>
function reload(form)
{
var val=form.cat.options[form.cat.options.selectedIndex].value;
self.location='dd3.php?cat=' + val ;
}
function reload3(form)
{
var val=form.cat.options[form.cat.options.selectedIndex].value;
var val2=form.subcat.options[form.subcat.options.selectedIndex].value;
self.location='dd3.php?cat=' + val + '&cat3=' + val2 ;
}
</script>
</head>
<body>
<a href="index.php">Back to List</a><br>
<form id="FormName" action="added.php" method="post" name="FormName">
<table width="448" border="0" cellspacing="2" cellpadding="0">
<tr><td width = "150"><div align="right"><label for="date">Date</label></div></td>
<td><input id="date" readonly="readonly" name="date" type="text" size="25" value="<?php echo date("d, M, Y"); ?> " ></td></tr>
<tr><td width = "150"><div align="right"><label for="name">Name</label></div></td>
<td><input id="name" name="name" type="text" size="25" value="" maxlength="255"></td></tr>
<tr><td width = "150"><div align="right"><label for="address">Address</label></div></td>
<td><textarea id="address" name="address" rows="4" cols="40"></textarea></td></tr><tr>
<td width = "150"><div align="right"><label for="tel">Tel</label></div></td>
<td><input id="tel" name="tel" type="text" size="25" value="" maxlength="11"></td></tr>
<?
///////// Getting the data from Mysql table for first list box//////////
$quer2=mysql_query("SELECT DISTINCT category,cat_id FROM category order by category");
///////////// End of query for first list box////////////
/////// for second drop down list we will check if category is selected else we will display all the subcategory/////
$cat=$_GET['cat']; // This line is added to take care if your global variable is off
if(isset($cat) and strlen($cat) > 0){
$quer=mysql_query("SELECT DISTINCT subcategory,subcat_id FROM subcategory where cat_id=$cat order by subcategory");
}else{$quer=mysql_query("SELECT DISTINCT subcategory,subcat_id FROM subcategory order by subcategory"); }
////////// end of query for second subcategory drop down list box ///////////////////////////
/////// for Third drop down list we will check if sub category is selected else we will display all the subcategory3/////
$cat3=$_GET['cat3']; // This line is added to take care if your global variable is off
if(isset($cat3) and strlen($cat3) > 0){
$quer3=mysql_query("SELECT DISTINCT subcat2 FROM subcategory2 where subcat_id=$cat3 order by subcat2");
}else{$quer3=mysql_query("SELECT DISTINCT subcat2 FROM subcategory2 order by subcat2"); }
////////// end of query for third subcategory drop down list box ///////////////////////////
echo"<tr><td>";
//echo "<form method=post name=f1 action='dd3ck.php'>";
////////// Starting of first drop downlist /////////
echo "<select name='cat' onchange=\"reload(this.form)\"><option value=''>Select one</option>";
while($noticia2 = mysql_fetch_array($quer2)) {
if($noticia2['cat_id']==@$cat){echo "<option selected value='$noticia2[cat_id]'>$noticia2[category]</option>"."<BR>";}
else{echo "<option value='$noticia2[cat_id]'>$noticia2[category]</option>";}
}
echo "</select> </td</tr>";
////////////////// This will end the first drop down list ///////////
?>
<tr><td width = "150"><div align="right"><label for="make">Make</label></div></td>
<td>
<?
////////// Starting of second drop downlist /////////
echo "<td><select name='subcat' onchange=\"reload3(this.form)\"><option value=''>Select one</option>";
while($noticia = mysql_fetch_array($quer)) {
if($noticia['subcat_id']==@$cat3){echo "<option selected value='$noticia[subcat_id]'>$noticia[subcategory]</option>"."<BR>";}
else{echo "<option value='$noticia[subcat_id]'>$noticia[subcategory]</option>";}
}
echo "</select></td></tr>";
////////////////// This will end the second drop down list ///////////
?>
<tr><td width = "150"><div align="right"><label for="model">Model</label></div></td>
<?
////////// Starting of third drop downlist /////////
echo "<td><select name='subcat3' ><option value=''>Select one</option>";
while($noticia = mysql_fetch_array($quer3)) {
echo "<option value='$noticia[subcat2]'>$noticia[subcat2]</option>";
}
echo "</select></td></tr>";
////////////////// This will end the third drop down list ///////////
//echo "<input type=submit value='Submit the form data'></form>";
?>
<tr><td width = "150"><div align="right"><label for="sn_imei">SN/IMEI</label></div></td>
<td><input id="sn_imei" name="sn_imei" type="text" size="25" value="" maxlength="20"></td></tr>
<tr><td width = "150"><div align="right"><label for="additional">Additional</label></div></td>
<td><input id="additional" name="additional" type="text" size="25" value="" maxlength="255"></td></tr>
<tr><td width = "150"><div align="right"><label for="date_of_collection">Date of Collection</label></div></td>
<td><input id="date_of_collection" name="date_of_collection" type="text" size="25">
<a href="javascript:NewCal('date_of_collection','ddmmyyyy')">
<img src="images/cal.gif" width="16" height="16" border="0" alt="Pick a date"></a></td></tr>
<tr><td width = "150"><div align="right"><label for="amount">Amount</label></div></td>
<td><input id="amount" name="amount" type="text" size="25" value="" maxlength="5"></td></tr>
<tr><td width="150"></td>
<td><input type="submit" name="submitButtonName" value="Add"></td></tr>
</table></form>
</body>
</html>
</code`<?php
require "config.php"; // Your Database details
?>
<!doctype html public "-//w3c//dtd html 3.2//en">
<html>
<head>
<title>Demo of Three Multiple drop down list box from plus2net</title>
<meta name="GENERATOR" content="Arachnophilia 4.0">
<meta name="FORMATTER" content="Arachnophilia 4.0">
<SCRIPT language=JavaScript>
function reload(form)
{
var val=form.cat.options[form.cat.options.selectedIndex].value;
self.location='dd3.php?cat=' + val ;
}
function reload3(form)
{
var val=form.cat.options[form.cat.options.selectedIndex].value;
var val2=form.subcat.options[form.subcat.options.selectedIndex].value;
self.location='dd3.php?cat=' + val + '&cat3=' + val2 ;
}
</script>
</head>
<body>
<a href="index.php">Back to List</a><br>
<form id="FormName" action="added.php" method="post" name="FormName">
<table width="448" border="0" cellspacing="2" cellpadding="0">
<tr><td width = "150"><div align="right"><label for="date">Date</label></div></td>
<td><input id="date" readonly="readonly" name="date" type="text" size="25" value="<?php echo date("d, M, Y"); ?> " ></td></tr>
<tr><td width = "150"><div align="right"><label for="name">Name</label></div></td>
<td><input id="name" name="name" type="text" size="25" value="" maxlength="255"></td></tr>
<tr><td width = "150"><div align="right"><label for="address">Address</label></div></td>
<td><textarea id="address" name="address" rows="4" cols="40"></textarea></td></tr><tr>
<td width = "150"><div align="right"><label for="tel">Tel</label></div></td>
<td><input id="tel" name="tel" type="text" size="25" value="" maxlength="11"></td></tr>
<?
///////// Getting the data from Mysql table for first list box//////////
$quer2=mysql_query("SELECT DISTINCT category,cat_id FROM category order by category");
///////////// End of query for first list box////////////
/////// for second drop down list we will check if category is selected else we will display all the subcategory/////
$cat=$_GET['cat']; // This line is added to take care if your global variable is off
if(isset($cat) and strlen($cat) > 0){
$quer=mysql_query("SELECT DISTINCT subcategory,subcat_id FROM subcategory where cat_id=$cat order by subcategory");
}else{$quer=mysql_query("SELECT DISTINCT subcategory,subcat_id FROM subcategory order by subcategory"); }
////////// end of query for second subcategory drop down list box ///////////////////////////
/////// for Third drop down list we will check if sub category is selected else we will display all the subcategory3/////
$cat3=$_GET['cat3']; // This line is added to take care if your global variable is off
if(isset($cat3) and strlen($cat3) > 0){
$quer3=mysql_query("SELECT DISTINCT subcat2 FROM subcategory2 where subcat_id=$cat3 order by subcat2");
}else{$quer3=mysql_query("SELECT DISTINCT subcat2 FROM subcategory2 order by subcat2"); }
////////// end of query for third subcategory drop down list box ///////////////////////////
echo"<tr><td>";
//echo "<form method=post name=f1 action='dd3ck.php'>";
////////// Starting of first drop downlist /////////
echo "<select name='cat' onchange=\"reload(this.form)\"><option value=''>Select one</option>";
while($noticia2 = mysql_fetch_array($quer2)) {
if($noticia2['cat_id']==@$cat){echo "<option selected value='$noticia2[cat_id]'>$noticia2[category]</option>"."<BR>";}
else{echo "<option value='$noticia2[cat_id]'>$noticia2[category]</option>";}
}
echo "</select> </td</tr>";
////////////////// This will end the first drop down list ///////////
?>
<tr><td width = "150"><div align="right"><label for="make">Make</label></div></td>
<td>
<?
////////// Starting of second drop downlist /////////
echo "<td><select name='subcat' onchange=\"reload3(this.form)\"><option value=''>Select one</option>";
while($noticia = mysql_fetch_array($quer)) {
if($noticia['subcat_id']==@$cat3){echo "<option selected value='$noticia[subcat_id]'>$noticia[subcategory]</option>"."<BR>";}
else{echo "<option value='$noticia[subcat_id]'>$noticia[subcategory]</option>";}
}
echo "</select></td></tr>";
////////////////// This will end the second drop down list ///////////
?>
<tr><td width = "150"><div align="right"><label for="model">Model</label></div></td>
<?
////////// Starting of third drop downlist /////////
echo "<td><select name='subcat3' ><option value=''>Select one</option>";
while($noticia = mysql_fetch_array($quer3)) {
echo "<option value='$noticia[subcat2]'>$noticia[subcat2]</option>";
}
echo "</select></td></tr>";
////////////////// This will end the third drop down list ///////////
//echo "<input type=submit value='Submit the form data'></form>";
?>
<tr><td width = "150"><div align="right"><label for="sn_imei">SN/IMEI</label></div></td>
<td><input id="sn_imei" name="sn_imei" type="text" size="25" value="" maxlength="20"></td></tr>
<tr><td width = "150"><div align="right"><label for="additional">Additional</label></div></td>
<td><input id="additional" name="additional" type="text" size="25" value="" maxlength="255"></td></tr>
<tr><td width = "150"><div align="right"><label for="date_of_collection">Date of Collection</label></div></td>
<td><input id="date_of_collection" name="date_of_collection" type="text" size="25">
<a href="javascript:NewCal('date_of_collection','ddmmyyyy')">
<img src="images/cal.gif" width="16" height="16" border="0" alt="Pick a date"></a></td></tr>
<tr><td width = "150"><div align="right"><label for="amount">Amount</label></div></td>
<td><input id="amount" name="amount" type="text" size="25" value="" maxlength="5"></td></tr>
<tr><td width="150"></td>
<td><input type="submit" name="submitButtonName" value="Add"></td></tr>
</table></form>
</body>
</html>
