甜蜜警报继续提交表格确认

我在提交表格时触发了这个甜蜜的事情。

$(".swa-confirm").on("submit", function(e) { e.preventDefault(); swal({ title: $(this).data("swa-title"), text: $(this).data("swa-text"), type: "warning", showCancelButton: true, confirmButtonColor: "#cc3f44", confirmButtonText: $(this).data("swa-btn-txt"), closeOnConfirm: false, html: false }, function() { } ); }); 

但点击确认我希望它继续提交表格…

我想到了不好的想法，例如：

 var confirmed = false; $(".swa-confirm").on("submit", function(e) { var $this = $(this); if (!confirmed) { e.preventDefault(); swal({ title: $(this).data("swa-title"), text: $(this).data("swa-text"), type: "warning", showCancelButton: true, confirmButtonColor: "#cc3f44", confirmButtonText: $(this).data("swa-btn-txt"), closeOnConfirm: true, html: false }, function() { confirmed = true; $this.submit(); }); } }); 

或者将swa移动到按钮点击而不是提交，并使用提交表单。

但是我不喜欢这个解决方案，它看起来像frankesteini。 当然有更好的方法

Answer 1

 $('#btn-submit').on('click',function(e){ e.preventDefault(); var form = $(this).parents('form'); swal({ title: "Are you sure?", text: "You will not be able to recover this imaginary file!", type: "warning", showCancelButton: true, confirmButtonColor: "#DD6B55", confirmButtonText: "Yes, delete it!", closeOnConfirm: false }, function(isConfirm){ if (isConfirm) form.submit(); }); }); 

Answer 2

我知道这已经晚了但是它可能会对未来的某些人有所帮助，我已成功地用这个来提交带有sweetalert确认的表格。

  $('#form_id').submit(function (e, params) { var localParams = params || {}; if (!localParams.send) { e.preventDefault(); } //additional input validations can be done hear swal({ title: "Confirm Entry", text: "Are you sure all entries are correct", type: "warning", showCancelButton: true, confirmButtonColor: "#6A9944", confirmButtonText: "Confirm", cancelButtonText: "Cancel", closeOnConfirm: true }, function (isConfirm) { if (isConfirm) { $(e.currentTarget).trigger(e.type, { 'send': true }); } else { //additional run on cancel functions can be done hear } }); }); 

Answer 3

我相信这更优雅一点：

 $(".swa-confirm").submit(function (e) { e.preventDefault(); swal({ title: $(this).data("swa-title"), text: $(this).data("swa-text"), type: "warning", showCancelButton: true, confirmButtonColor: "#cc3f44", confirmButtonText: $(this).data("swa-btn-txt"), closeOnConfirm: false, html: false }, function(){ $(".swa-confirm").off("submit").submit(); }); }); 

Answer 4

这是另一个例子，要求用户通过复选框确认。

HTML

 
 Submit  

JavaScript的

 $(document).on('click', '#btn-submit', function(e) { e.preventDefault(); swal({ title: 'Confirm', input: 'checkbox', inputValue: 0, inputPlaceholder: ' I agree with the Terms', confirmButtonText: 'Continue', inputValidator: function (result) { return new Promise(function (resolve, reject) { if (result) { resolve(); } else { reject('You need to agree with the Terms'); } }) } }).then(function (result) { $('#myForm').submit(); }); }); 

Answer 5

function testalert（）{

 swal( { title : "Are you sure?", text : "You want to save?", type : "warning", allowEscapeKey : false, allowOutsideClick : false, showCancelButton : true, confirmButtonColor : "#DD6B55", confirmButtonText : "Yes", showLoaderOnConfirm: true, closeOnConfirm : false }, function (isConfirm) { if (isConfirm) { profileinfo.submit(); return true; } return false; } ); 

}

Answer 6

将类.swa-confirm应用于输入提交

 $(".swa-confirm").on("click", function(e) { e.preventDefault(); swal({ title: $(this).data("swa-title"), text: $(this).data("swa-text"), type: "warning", showCancelButton: true, confirmButtonColor: "#cc3f44", confirmButtonText: $(this).data("swa-btn-txt"), closeOnConfirm: true, html: false }, function( confirmed ) { if( confirmed ) $(this).closest('form').submit(); }); }); 

首先阻止按钮事件。 之后，启动sweetalert，如果“确认”为真，则提交#my-form元素。

抱歉，我的英语不好，来自墨西哥的问候，我用Google翻译：v。