[英]ignore previous ajax request
Code Updated 代码已更新
This is my js 这是我的js
destroy.js.erb destroy.js.erb
$('.delete_loop').on('ajax:success', function () {
$(this).closest('tr').fadeOut();
var loopNumber = $('.form-loop-number').html()
$('.form-loop-number').html(loopNumber - 1)
});
my ajax is called with rails :remote => true helper 我的ajax被称为rails:remote => true helper
index.html.erb: index.html.erb:
= link_to calendar_video_ad_schedule_path(schedule.id), method: :delete, :remote => true, data: { confirm: 'Êtes vous sûr ?' }, :class => 'delete_loop' do
i.icon-trash style='color:grey; font-size: 1.2em'
When I delete an item I want the number of my .form-loop-number in the html to decrease. 删除项目时,我希望html中的.form-loop-number数量减少。 It works the 1st time, but if I call the method twice or more, the number decreases more than once. 它第一次起作用,但是如果我两次或更多次调用该方法,则数量减少一次以上。
1st time I remove item: loopNumber - 1 第一次删除项目:loopNumber-1
2nd time I remove item: loopNumber - 2 第二次我删除项目:loopNumber-2
3rd time I remove item: loopNumber - 3 第三次我删除项目:loopNumber-3
etc... 等等...
My controller responds sur js format 我的控制器响应sur js格式
controller: 控制器:
def destroy
@schedule = Schedule::VideoAd.find(params[:id])
@schedule.destroy
respond_to do |format|
format.html
format.js
end
end
I only want it to decrease 1 each time. 我只希望每次减少1。 How can I do this ? 我怎样才能做到这一点 ?
Your 你的
$('.delete_loop').on('ajax:success', function () {
...
});
event assignment is inside the code invoked during "delete" operation. 事件分配在“删除”操作期间调用的代码内。 Every time you delete, you add a new 'ajax:success' event handler. 每次删除时,都会添加一个新的'ajax:success'事件处理程序。 All these event handlers are executed on subsequent "delete"s. 所有这些事件处理程序都在后续的“删除”上执行。 Move the above event assignment inside 将上述事件分配移到内部
$(document).ready(function() {
...
});
Rather than using the global ajax:success event handler, try using the success handler for your specific ajax call. 与其使用全局ajax:success事件处理程序,不如对您的特定ajax调用使用成功处理程序。 I can't see the rest of your code, but if there's any other ajax it could be hitting this handler. 我看不到其余的代码,但是如果还有其他的Ajax,可能会击中该处理程序。
function deleteMyStuff(){
$.ajax({
url: '/delete-my-stuff/',
success: function(response) {
$('.delete_loop').closest('tr').fadeOut();
var loopNumber = $('.form-loop-number').html();
$('.form-loop-number').html(loopNumber - 1);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert("Error: " + errorThrown);
}
});
}
Also, from the docs: http://api.jquery.com/ajaxSuccess/ 另外,从文档中: http : //api.jquery.com/ajaxSuccess/
As of jQuery 1.8, the .ajaxSuccess() method should only be attached to document. 从jQuery 1.8开始,.ajaxSuccess()方法仅应附加到文档。
So attaching it to the .delete_loop element could be causing unwanted behavior. 因此,将其附加到.delete_loop元素可能会导致不良行为。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.