Hello!
I'm having some problems with using data in an PHP form I'm working on that utilizes AJAX. Could be a beginner's mistake, but, then again, it might not be... :)
SCENARIO:
I have a form with two sets of fields, origin country, city, state, and zip, and destination country, city, state, and zip. In each set, the country drop-down is only visible (options are USA, Canada, and Mexico) until the user selects a country, after which they see a text field for city, another drop-down with a listing for all the states in the country they've selected, and a text field for zip code. Before they select a country, in place of the city, state, and zip fields, all they see is a line of text, asking the user to select a country.
The AJAX portion of the menu seems to work fine. When you select a country, the city, state, and zip fields show up, as they're supposed to. However, after filling them out, and submitting the form, it tells me that I didn't fill out the required fields of origin city, state, and country. After loading the page, and checking the source, I'm finding that, even though the page is displaying the fields, the source still thinks that the "please select a country" text is still there. So, it seems that my problem is getting the form fields to actually *insert* into the form, and not just display.
The three files I use for this are add.php, getstates.php and selectstate.js
First, here is add.php, the main form (or at least the form with as much extraneous info removed as I could):
<?php require_once('Connections/Connection.php'); ?>
$editFormAction = $_SERVER['PHP_SELF'];
if (isset($_SERVER['QUERY_STRING'])) {
$editFormAction .= "?" . htmlentities($_SERVER['QUERY_STRING']);
}
if ((isset($_POST["MM_insert"])) && ($_POST["MM_insert"] == "form2")) {
$insertSQL = sprintf("INSERT INTO Loads (Origin_Country, Origin_City, Origin_State, Origin_Zip, Dest_Country, Dest_City, Dest_State, Dest_Zip) VALUES (%s, %s, %s, %s, %s, %s, %s, %s)",
GetSQLValueString($_POST['Origin_Country'], "text"),
GetSQLValueString($_POST['Origin_City'], "text"),
GetSQLValueString($_POST['Origin_State'], "text"),
GetSQLValueString($_POST['Origin_Zip'], "text"),
GetSQLValueString($_POST['Dest_Country'], "text"),
GetSQLValueString($_POST['Dest_City'], "text"),
GetSQLValueString($_POST['Dest_State'], "text"),
GetSQLValueString($_POST['Dest_Zip'], "text"));
mysql_select_db($database_Connection, $Connection);
$Result1 = mysql_query($insertSQL, $Connection) or die(mysql_error());
$insertGoTo = "member_profile.php";
if (isset($_SERVER['QUERY_STRING'])) {
$insertGoTo .= (strpos($insertGoTo, '?')) ? "&" : "?";
$insertGoTo .= $_SERVER['QUERY_STRING'];
}
header(sprintf("Location: %s", $insertGoTo));
}
<html xmlns:wdg="http://ns.adobe.com/addt"><head>
<script src="selectstate.js"></script>
</head>
<body>
<table>
<tr>
<td>
Origin Country:
</td>
<td>
<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>
<td>
<?PHP $currentrow = "Origin";?><?PHP echo $currentrow." ";?>City, State, and Zip:
</td>
<td>
<div id="States">Select a country to view origin options.</div>
</td>
</tr>
<tr>
<td>
Destination Country:
</td>
<td>
<select name="Dest_Country" onChange="showStates2(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>
<td>
<?PHP $currentrow = "Dest";?><?PHP echo $currentrow."ination ";?> City, State, and Zip:
</td>
<td>
<div id="States2">Select a country to view destination options.</div>
</td>
</tr>
</table>
</body>
</html>Next is getstates.php, the code that is supposed to be inserted into the form when the user selects a country (but it only seems to display the fields, not insert them into the form, so that they can be used):
<?php require_once('Connections/Connection.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, $Connectin);
$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);?>
<body>
<input type='text' name='<?PHP echo $currentrow;?>_City' value='' size='17' />
,
<select name='<?PHP echo $currentrow;?>_State'>
<?PHP
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);
}
?>
</select>
<input name='<?PHP echo $currentrow;?>_Zip'." type='text' value='' size='10' maxlength='10' />
</body>
<?PHP
mysql_free_result($GetStates);
?>...and, finally, selectstate.js, the file that makes it all work...er...sort of...
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 showStates2(str2)
{
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request");
return;
}
var url2="getstates.php";
url2=url2+"?q="+str2;
url2=url2+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged2;
xmlHttp.open("GET",url2,true);
xmlHttp.send(null);
}
function stateChanged2()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("States2").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;
}So, that's pretty much the long and short of it. Thanks to anyone who can assist in any way, and please let me know if there are any questions!
