在javascript confirm()取消后,在表单提交按钮上运行AJAX函数

Run AJAX function on form submit button after javascript confirm() cancel

本文关键字:按钮 运行 函数 AJAX 表单提交 javascript confirm 取消后      更新时间:2023-09-26

我有一个表单,其中AJAX函数在表单提交时运行,以确保表单中的数据不会与数据库中的数据冲突。如果发现冲突,AJAX函数会弹出confirm()框。如果用户单击"确定",则提交表单。如果他们单击"取消",则不会提交表单。

这就是问题所在。如果他们点击取消,然后调整表单中的值并再次提交,那么AJAX函数在下次点击表单提交按钮时不会运行。有没有一种方法可以让AJAX函数在每次点击提交时运行,即使他们之前已经取消了表单提交?

以下是AJAX函数的截断版本:

$('#publish').one('click', function (e) {
    e.preventDefault();
    var url = shiftajax.ajaxurl;
    var shift = $('#post_ID').val();
    var data = {
        'action': 'wpaesm_check_for_schedule_conflicts_before_publish',
        'shift': shift,
    };
    $.post(url, data, function (response) {
        if( response.action == 'go' ) {
            // submit the form
            $('#post').submit();
        } else {
            // ask user for confirmation
            if (confirm(response.message)) {
                // user clicked OK - submit the form
                $('#post').submit();
            } else {
                // user clicked cancel - do nothing
            }
        }
    });
});

就像我说的,这很好用,但如果你在点击"取消"按钮后点击提交按钮,AJAX就不会启动。

值得一提的是,当你点击WordPress自定义帖子类型上的"发布"按钮时,这个AJAX函数就会运行。

不要使用one(它只会触发ajax提交或按钮单击一次),在这里使用var IsBusy来检查用户没有重复按下表单提交,

尝试以下代码,

var isBusy = false; //first time, busy state is false
$('#publish').on('click', function (e) {

    if(isBusy == true)
        return ; //if Busy just return dont submit
    else
        isBusy= true; //true , tell that ajax is now busy processing a request
    e.preventDefault();
    var url = shiftajax.ajaxurl;
    var shift = $('#post_ID').val();
    var data = {
        'action': 'wpaesm_check_for_schedule_conflicts_before_publish',
        'shift': shift,
    };
    $.post(url, data, function (response) {
        if( response.action == 'go' ) {
            // submit the form
            $('#post').submit();
        } else {
            // ask user for confirmation
            if (confirm(response.message)) {
                // user clicked OK - submit the form
                $('#post').submit();
            } else {
                // user clicked cancel - do nothing
            }
        }
        isBusy = false;
    });
});