I believe this should be pretty trivial, but I cannot figure it out at all. I am doing a small test with sending an AJAX request, and echoing a variable extracted from a drop-down menu.
However, it doesn't seem to be executing whatsoever. I was wondering if someone could help me point out what's wrong?
Here are the relevant snippets from index.php:
<html>
<?php
//create a drop down of available accounts
echo 'Available Accounts: ';
echo '<select name=dropAccounts class=dropAccounts>';
//if there is at least one account available
if (count($accsAvailable) > 0) {
echo '<option value=0>---Select an account---</option>'; //default option
foreach ($accsAvailable as $account) {
//populate from API
echo '<option value=' . $account->getId() . '>' . $account->getName() . '</option>';
}
} else {
echo '<option value=0>---No accounts---</option>'; //else if no accounts exist
}
echo '</select>';
//for available webproperties
echo '<br> Available Webproperties: ';
echo '<select name=dropProperties class=dropProperties>';
echo '<option selected=selected>---Select a webproperty---</option>';
echo '</select>';
?>
</html>
The important thing to take away from the snippet is that the first drop-down menu is called 'dropAccounts'.
here is my JS script for handling an onchange event on 'dropAccounts':
<script type="text/javascript">
$(document).ready(function()
{
$(".dropAccounts").change(function()
{
var id=$(this).val();
var dataString = 'id='+ id;
$.ajax
({
type: "POST",
url: "propertyID.php",
data: dataString,
cache: false,
success: function(html)
{
$(".dropProperties").html(html);
}
});
});
});
</script>
I eventually intend to populate the second drop-down menu 'dropProperties' using the value grabbed from 'dropAccounts' but it's not even echoing in my PHP script.
propertyID.php:
<?php
if($_POST['id'])
{
$accountID = $_POST['id'];
echo $accountID;
}
?>
I was following the tutorial found here: http://www.9lessons.info/2010/08/dynamic-dependent-select-box-using.html