**Edited this post because I found the problem is really in the inability of rails to bind to the ajax:success function.
***Using rails 3.2.3
Thanks for taking the time to read and try to help.
I am adding a simple fade out function on the ajax:success of an item being deleted, as follows:
$(document).ready( jQuery(function($) {
$('.delete').bind('ajax:success', function() {
$(this).closest('div').fadeOut();
});
}));
#For some reason had to pass the $ into the function to get it to work,
#not sure why this is necessary but doesn't work unless that is done.
After this, I wanted to create an object with unobtrusive jQuery when the user adds something, and have working delete buttons on those as well. I made a create.js.erb file that is called after creating a new item - and the creation works fine, but the delete button cannot access the ajax:success event.
It does delete the data from the db when clicked, but the .fadeOut is never bound to it, so it doesn't disappear. The create.js.erb is as follows:
#$("div").append(html) here, then call the function below to try and bind the ajax:success function
$('.delete').bind('ajax:complete', function() {
$(this).closest('div').fadeOut();
});
If I change this to bind to the click function, it works, but this doesn't account for a failed ajax call:
#$("div").append(html) here, then call the function below to try and bind the ajax:success function
$('.delete').bind('click', function() {
$(this).closest('div').fadeOut();
});
So something must be up with binding to the ajax:success after the item is created. You guys have any idea why this might be happening? Do I need to do something special in rails to get the newly rendered item to recognize ajax events? Any direction would be much appreciated!
P.S. The controller for the delete method is below