用户提交弹出窗体时发送多个ajax调用
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了用户提交弹出窗体时发送多个ajax调用相关的知识,希望对你有一定的参考价值。
在我的应用程序中,有一个jQuery弹出窗口,我在其中列出供应商以及每个供应商前面的复选框。然后,用户可以选中每个供应商的一个复选框,然后按删除按钮删除供应商。但是,一旦用户单击删除按钮,ajax调用将正确发送到服务器端并在服务器端正确删除供应商(已删除的供应商不再显示在列表中)。一旦用户再次执行相同操作,我注意到弹出窗口向服务器端发送两个ajax请求。如果用户第三次点击,弹出窗口会发送三次ajax请求,依此类推。
var ajaxURL = getFormAction('crm.web.SupplierManager',
'deleteSupplierRequestAjax');
$("#deleteBtnId").click(function( event ) {
$( "#supplierDeleteConfirmDivId" ).dialog( "open" );
$( "#supplierPopupCancelBtnId" ).click(function( event ) {
$( "#supplierDeleteConfirmDivId" ).dialog( "close" );
event.preventDefault();
});
$( "#supplierPopupOkBtnId" ).click(function( event ) {
$( "#supplierDeleteConfirmDivId" ).dialog( "close" );
$("#supplierPopupOkBtnId").mask("Waiting...");
$.ajax({
type: 'POST',
data: $("#formId").serialize(),
url: ajaxURL,
success: function (data) {
$("#supplierPopupOkBtnId").html(data);
$("#supplierPopupOkBtnId").unmask();
},
error: function(jQXHR, textStatus, errorThrown) {
$("#supplierPopupOkBtnId").unmask();
handleAjaxError(jQXHR, textStatus, errorThrown);
}
});
});
event.preventDefault();
});
对我来说,它似乎是表单,每次用户单击删除按钮时,渲染都会累积到弹出窗口中。我不确定这是真正的原因。我猜$("#formId").serialize()
惹麻烦。谁有不同的想法?
答案
附:
$( "#supplierPopupCancelBtnId" ).click(function( event ){})
每次按钮上都有一个新的监听器,这是累积的。
尝试使用“one”:
$( "#supplierPopupCancelBtnId" ).one( "click", function() {});
来自jquery文档:
“.one()方法与.on()完全相同,除了给定元素和事件类型的处理程序在第一次调用后未绑定。”
以上是关于用户提交弹出窗体时发送多个ajax调用的主要内容,如果未能解决你的问题,请参考以下文章