Your best bet is to manually call your "populate" functions when you want to load the cascaded values. To do this, you'll need to break them out into named functions. This gives you the ability to trigger dropdown population at any point.
$(document).ready(function()
{
function populateProperties(accountId) {
$.ajax
({
type: "POST",
url: "propertyID.php",
data: {
'accountID' : accountId
},
cache: false,
success: function(html)
{
$(".dropProperties").html(html);
// Populate profiles after properties load
populateProfiles($(".dropProperties").val());
}
});
}
function populateProfiles(propertyId) {
$.ajax
({
type: "POST",
url: "profileID.php",
data: {
'id' : propertyId
},
cache: false,
success: function(html)
{
$(".dropProfiles").html(html);
}
});
}
$(".dropAccounts").change(function()
{
var accountID = $(this).val(); //gets the account ID from drop-down value
populateProperties(accountID);
});
$(".dropProperties").change(function()
{
var id = $(this).val(); //gets the profile ID from drop-down value
populateProfiles(id);
});
// Call populateProperties on page load to kick things off
populateProperties($(".dropAccounts").val());
});