I am trying to make a linked select menu using ajax, and it works as i am expecting, but the problem is when I submit the form, the menu which gets populated from ajax query cant be accessed through POST or GET request. below is the code i used to request the server to get the Cities value for selected State through ajax.
<?php require_once("includes/initialize.php");
if (isset($_POST['submitted'])) {
$state = $_POST['state'];
$city = $_POST['city'];
echo $state; // output 1
echo $city; // No output
}
$state = State::find_all();
?>
<html>
<head>
<script type = "text/javascript" src = "js/getcities.js"></script>
<script type="text/javascript">
var ajax = new Array();
function getCityList(sel)
{
var state_id = sel.options[sel.selectedIndex].value;
document.getElementById('city').options.length = 0; // Empty city select box
if(state_id.length>0){
var index = ajax.length;
ajax[index] = new sack();
ajax[index].requestFile = 'getcities.php?state_id='+state_id; // Specifying which file to get
ajax[index].onCompletion = function(){ createCities(index) }; // Specify function that will be executed after file has been found
ajax[index].runAJAX(); // Execute AJAX function
}
}
function createCities(index)
{
var obj = document.getElementById('city');
eval(ajax[index].response); // Executing the response from Ajax as Javascript code
//var city = ajax[index].response;
//alert("Options are: " + city);
}
</script>
</head>
<body>
<form action="test.php" method="post">
<table>
<tr>
<td>State: </td>
<td><select id="state" name="state" onChange="getCityList(this)">
<option value="">Select a country</option>
<?php
foreach ($state as $states) {
echo '<option value="';
echo $states->state_id;
echo '">';
echo $states->state;
echo '</option>';
}
?>
</select>
</td>
</tr>
<tr>
<td>City: </td>
<td><select id="city" name="city" > </select> </td>
</tr>
<input type="hidden" name="submitted" value="TRUE"/>
<input type="image" src="images/submit.jpg" name="submit" id="submit"/>
</table>
</form>
</body>
</html>
well, all i need to know is, is there any way i could catch the value of select menu in a variable so that i can use the value selected in the second select menu while submitting the form through POST or GET request ? thanks