Reputation: 169
I came on here a few days ago with a problem, they got it to work. However, when I go to duplicate it, it fails. Leaving me very confused.
Here is the jquery
function loadSubCats(value)
{
$.post("load_sub_cats.php",{ "catid": value },
function(data) {
$('#sub_categories').html(data);
});
}
function loadSubCatsB(value)
{
$.post("load_sub_catsb.php",{ "catidb": value },
function(data) {
$('#sub_categoriesb').html(data);
});
}
I have the form select fields (1 in the file, 1 in load_sub_cats.php)
echo"<select name='cselect2' onChange='loadSubCatsb(this.value)' class='e1'><option value='0'>Please Select Location</option>";
Now to explain the issue, when I select a value from the main select, the second select appears fine. BUT when i select form that it appears the third isn't appearing (or even being called). I have the jquery in the parent file along with both of the div's. I have tried including these in the subfiles but same issue. I just can't seem to call the third page.
Upvotes: 1
Views: 76
Reputation: 12433
I believe that javascript user-defined functions are case-sensitive. You have -
function loadSubCatsB
but calling -
onChange='loadSubCatsb(this.value)'
Try changing to -
onChange='loadSubCatsB(this.value)'
Upvotes: 1
Reputation: 10264
Instead of onChange, try using jQuery's live
functions. ie:
Instead of:
onChange='loadSubCatsb(this.value)
Use this in your $().ready or equivalent function:
$('.e1').on('change', function() {
var newValue = $(this).val();
loadSubCatsB(newVal);
});
Upvotes: 0
Reputation: 24276
Your php echo is incorrect formated!
Try this instead:
echo '<select name="cselect2" onChange="loadSubCatsb(this.value)" class="e1"><option value="0">Please Select Location</option></select>';
Upvotes: 0