Post by Daniel on Dec 29, 2007 17:16:15 GMT
index.php:
drawCountrySub.php:
What this code does is you choose an option from the select field and it then uses ajax to draw a text box (and also another select field but I took that out to simplify the code).
I ran into problems when I tried to have more than one select field do this on the same page. So I tried putting it in the loop and giving the functions different names.
The Problem I have is that if you select an option for a few of the select fields and enter names into the city fields, when you submit the form it only redraws the city field for the last changed select box.
At one point I had that fixed and the main problem is that even if it does redraw the text fields for each changed select, it only display the value of the last text box in all the fields. Does that make sense?
On my page, there are other fields besides this and I check for errors and if there are errors, I still want to retain the select field and city field values so the user doesn't have to reenter all of that because they forgot something else.
Let me know if you need any more clarification. Thanks a lot.
<form method='post'>
<script type="text/javascript">
function GetXmlHttpObject(handler)
{
var objXMLHttp=null
if (window.XMLHttpRequest)
{
objXMLHttp=new XMLHttpRequest()
}
else if (window.ActiveXObject)
{
objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
}
return objXMLHttp
}
</script>
<?php
function build_select_options($display, $select_array, $selected = '') {
$field = "\n<option value=''>$display</option>\n";
for ($x = 0; $x < count($select_array); $x++) {
if ($select_array[$x] == $selected) {
$field .= "\t<option value='$select_array[$x]' selected>$select_array[$x]</option>\n";
}
else {
$field .= "\t<option value='$select_array[$x]'>$select_array[$x]</option>\n";
}
}
return $field;
}
for ($i=0; $i <=4; $i++) {
?>
<script type="text/javascript">
function stateChanged<?php echo $i;?>()
{
if (xmlHttp.readyState==4 ¦¦ xmlHttp.readyState=="complete")
{
document.getElementById("ajaxSelect<?php echo $i;?>").innerHTML= xmlHttp.responseText;
}
else {
//alert(xmlHttp.status);
}
}
// Will populate data based on input
function htmlData<?php echo $i;?>(url, qStr)
{
if (url.length==0)
{
document.getElementById("ajaxSelect<?php echo $i;?>").innerHTML="";
return;
}
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request");
return;
}
url=url+"?"+qStr;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged<?php echo $i;?>;
xmlHttp.open("GET",url,true) ;
xmlHttp.send(null);
}
</script>
<?php
$countries = array("1", "2", "3");
echo "<p><ul class='info'><li><strong>Origin:</strong> <select name=\"country$i\" onchange=\"htmlData$i('drawCountrySub.php', 'c='+this.value+'&i=$i')\" />".build_select_options("Country", $countries, $_POST['country'.$i])."</select> ";
if ($_POST['country'.$i]!= "") {
echo "<script type='text/javascript'>
htmlData$i('drawCountrySub.php', 'c=".$_POST['country'.$i]."&city=".$_POST['city'.$i]."&i=".$i."');
</script>";
}
echo "<div id='ajaxSelect$i'> </div></li></ul></p>";
}//end of loop
?>
<input type="submit">drawCountrySub.php:
<?php
$i = $_GET['i'];
echo " <span class='info'>City:</span> <input type='text' name='city$i' value='".stripslashes(trim($_GET['city']))."' size='18'>";
?>What this code does is you choose an option from the select field and it then uses ajax to draw a text box (and also another select field but I took that out to simplify the code).
I ran into problems when I tried to have more than one select field do this on the same page. So I tried putting it in the loop and giving the functions different names.
The Problem I have is that if you select an option for a few of the select fields and enter names into the city fields, when you submit the form it only redraws the city field for the last changed select box.
At one point I had that fixed and the main problem is that even if it does redraw the text fields for each changed select, it only display the value of the last text box in all the fields. Does that make sense?
On my page, there are other fields besides this and I check for errors and if there are errors, I still want to retain the select field and city field values so the user doesn't have to reenter all of that because they forgot something else.
Let me know if you need any more clarification. Thanks a lot.