midijunkie
Technical User
Hello, everypeople!
I am working with a form that utilizes AJAX to take a selected country (MEX, USA, CAN) from a drop-down menu, and, depending on what the user selects, displays another drop-down menu, allowing the user to select a state within from their selected country. I can get it to work perfectly fine if I institute the code once on a form, but it will not work properly if I try to insert it more than once (selecting a country in 'country/state set 1' also affects displays that country's states menu in 'country/state set 2' - they seem to be linked by something).
I have tried altering the PHP in the main file, as well as 'getstates.php' to try and allow for a second instance of the .js file, as well as trying to include a second set of variables in the .js file to allow for a second set of countries/states, but neither helped.
The code for all 3 files is shown below. I have stripped out unnecessary HTML/PHP from form.php, as about 10% of the code in that form is pertinent to my problem.
First: selectstates.js
Second: getstates.php
Last: form.php
Thank you for any help you can provide, and please excuse the multiple languages in this post. Since JS is the script that I have the least amount of experience with, I figure that it's most likely where my problem lies.
I am working with a form that utilizes AJAX to take a selected country (MEX, USA, CAN) from a drop-down menu, and, depending on what the user selects, displays another drop-down menu, allowing the user to select a state within from their selected country. I can get it to work perfectly fine if I institute the code once on a form, but it will not work properly if I try to insert it more than once (selecting a country in 'country/state set 1' also affects displays that country's states menu in 'country/state set 2' - they seem to be linked by something).
I have tried altering the PHP in the main file, as well as 'getstates.php' to try and allow for a second instance of the .js file, as well as trying to include a second set of variables in the .js file to allow for a second set of countries/states, but neither helped.
The code for all 3 files is shown below. I have stripped out unnecessary HTML/PHP from form.php, as about 10% of the code in that form is pertinent to my problem.
First: selectstates.js
Code:
var xmlHttp;
function showStates(str)
{
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request");
return;
}
var url="getstates.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}
function stateChanged()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("States").innerHTML=xmlHttp.responseText;
}
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
xmlHttp=new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
}
catch (e)
{
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); //Internet Explorer
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}Second: getstates.php
Code:
<?php require_once('Connections/Board.php'); ?>
<?php
$q=$_GET["q"];
if (!function_exists("GetSQLValueString")) {
function GetSQLValueString($theValue, $theType, $theDefinedValue = "", $theNotDefinedValue = "")
{
if (PHP_VERSION < 6) {
$theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue;
}
$theValue = function_exists("mysql_real_escape_string") ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue);
switch ($theType) {
case "text":
$theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
break;
case "long":
case "int":
$theValue = ($theValue != "") ? intval($theValue) : "NULL";
break;
case "double":
$theValue = ($theValue != "") ? doubleval($theValue) : "NULL";
break;
case "date":
$theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
break;
case "defined":
$theValue = ($theValue != "") ? $theDefinedValue : $theNotDefinedValue;
break;
}
return $theValue;
}
}
mysql_select_db($database_Board, Board);
$query_GetStates = "SELECT States.Abbreviation FROM States WHERE States.Country = '".$q."' ORDER BY States.Abbreviation ASC";
$GetStates = mysql_query($query_GetStates, $TheBoard) or die(mysql_error());
$row_GetStates = mysql_fetch_assoc($GetStates);
$totalRows_GetStates = mysql_num_rows($GetStates);
echo "<select name='"."$currentrow"."'>";
do
{
echo '<option value="'.$row_GetStates['Abbreviation'].'">'.$row_GetStates['Abbreviation']."</option>";
} while ($row_GetStates = mysql_fetch_assoc($GetStates));
$rows = mysql_num_rows($GetStates);
if($rows > 0)
{
mysql_data_seek($GetStates, 0);
$row_GetStates = mysql_fetch_assoc($GetStates);
}
echo "</select>";
mysql_free_result($GetStates);
?>Last: form.php
Code:
<html xmlns:wdg="[URL unfurl="true"]http://ns.adobe.com/addt"><head>[/URL]
<script src="selectstate.js"></script>
</head>
<body>
<form action="<?php echo $editFormAction; ?>" method="post" name="form2" id="form2">
<tr valign="baseline">
<td align="right" valign="middle" nowrap="nowrap">Origin Country:</td>
<td width="65%"><select name="Origin_Country" onChange="showStates(this.value)">
<option value="" selected="selected">Select country</option>
<option value="USA">United States</option>
<option value="CAN">Canada</option>
<option value="MEX">Mexico</option>
</select></td>
</tr>
<tr valign="baseline">
<td align="right" valign="middle" nowrap="nowrap"><?PHP $currentrow = "Origin_State"; ?>Origin State/Province:</td>
<td><div id="States">Select a country to view states menu.</div></td>
</tr>
<tr valign="baseline">
<td align="right" valign="middle" nowrap="nowrap">Destination Country:</td>
<td><select name="Dest_Country" onChange="showStates(this.value)">
<option value="" selected="selected">Select country</option>
<option value="USA">United States</option>
<option value="CAN">Canada</option>
<option value="MEX">Mexico</option>
</select></td>
</tr>
<tr valign="baseline">
<td align="right" valign="middle" nowrap="nowrap"> </td>
<td align="right" valign="middle" nowrap="nowrap"><?PHP $currentrow = "Dest_State"; ?>Destination State:</td>
<td><div id="States">Select a country to view states menu.</div></td>
</tr>
<tr valign="baseline">
<td height="24" align="right" nowrap="nowrap"> </td>
<td align="right" nowrap="nowrap"> </td>
<td width="65%"><input type="submit" value="Submit" /></td>
</tr>
</table>
<input type="hidden" name="MM_insert" value="form2" />
</form>
</body>
</html>Thank you for any help you can provide, and please excuse the multiple languages in this post. Since JS is the script that I have the least amount of experience with, I figure that it's most likely where my problem lies.
