【问题标题】:Run AJAX function on form submit button after javascript confirm() canceljavascript confirm() 取消后在表单提交按钮上运行 AJAX 函数
【发布时间】:2015-09-08 16:30:45
【问题描述】:

我有一个表单,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 功能就会运行。

【问题讨论】:

    标签: javascript jquery ajax wordpress forms


    【解决方案1】:

    不要使用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;
        });
    
    });
    

    【讨论】:

    • 太棒了 :) 一个是罪魁祸首,但一个在许多其他情况下很有用
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2020-06-27
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-03-23
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多