jQuery select(live, change) and .ajax only firing once
I have a page that has 52 drop-down menus with the class of regionalSelect.
I have bound the change event to trigger an ajax run to the controller to save to the database and the success callback function is to refresh the page.
After the refresh, the functionality no longer works.
I place this code is my document ready
$("select.regionalSelect").live('change', function(){
var sel = $(this).val();
var id = $(this).parent().parent().find("td[name=propNumber]").html();
$.ajax({
url:"<?php echo site_url('conn/reassignRegional'); ?>",
type: 'POST',
data:{ id: id, regional: sel },
success: function(msg){
var link = "<?php echo site_url('conn/PropertiesAndRegions'); ?>";
window.location.href=link;
} // end success
}); // end ajax
}); // end change
The controller just takes the posted values 开发者_运维百科and inserts it into the database. When the page refreshes, the list is correct but additional changes can't be made.
Since I am presenting a list of our properties and their current regional directors and a mechanism to change as regionals get reassigned, the continued availability of editing is a necessity.
I have been staring at this a while and I am not that experienced a coder as it is, so I decided to ask for fresh eyes.
All help is greatly appreciated!
Thanks, Jon
Do you need to be using .live()
? If your select elements aren't being added dynamically to the page after it loads, then it isn't necessary. Instead, you might be able to use
$('select.regionalSelect').change(function() {
...
});
instead, which has mostly the same behavior but a different purpose.
Also, when redirecting with JS, you should assign your link to window.location.href
instead of just window.location
. And make sure your AJAX requests aren't cached (POSTs shouldn't be, but you never know).
To disable cache globally for jQuery, you can do this:
$.ajaxSetup({
cache: false
});
精彩评论