在 AJAX 函数中提交表单答案

【问题标题】：Submit a form in an AJAX function在 AJAX 函数中提交表单
【发布时间】：2016-07-01 07:20:18
【问题描述】：

服务器端方法有效，AJAX 函数设置data-duplicated="false" 但$this.submit(); 无效。要真正提交表单，我需要再次按下 sumbit 按钮。

<form data-url="/.../" data-duplicated="true" onsubmit="return checkForDuplicates(this)">
   <!-- Form inputs -->
</form>

function checkForDuplicates(e) {
        var $this = $(e);
        var url = $this.attr('data-url');

        if ($this.attr('data-duplicated') === 'true') {

            $.ajax({
                url: url,
                type: 'POST',
                data: data,
                success: function (result) {
                    if (result === true) {
                        $this.attr('data-duplicated', 'false');
                        $this.submit();
                    } else {
                        // warrning
                    }
                }
            });

            return false;
        }
        return true;
    }

我应该怎么做才能真正提交表单？

【问题讨论】：

试试这个：$this[0].submit();
如果您使用的是ajax，为什么要提交form？
@IsmailRBOUH - this[0].submit 不是函数。
@Rayon - 我想检查是否存在重复项，如果存在我不想提交表单。否则，应提交。
@Bacchus，那你说的是错误的方法。

标签： javascript jquery ajax forms

【解决方案1】：

demo link

JavaScript 代码

$('input[type="submit"]').click(function(e) {
  e.preventDefault();
  checkForDuplicates(this);
})

function checkForDuplicates(e) {
  var _form = $(e).closest('form');
  var url = _form.attr('data-url');

  if (_form.attr('data-duplicated') === 'true') {
    var data = {};
    var url = '/';
    $.ajax({
      url: url,
      type: 'POST',
      data: data,
      success: function(result) {
        if (result === true) {
          _form.attr('data-duplicated', 'false');
          _form.trigger('submit');
        } else {
          // warrning
        }
      }
    });

  }
}

HTML 代码：

<form data-url="/.../" data-duplicated="true">
  <input type="submit">
</form>

【讨论】：

代码的工作方式与我的完全相同，但现在即使我第二次单击提交按钮也没有提交表单（我猜 .trigger('submit') 不起作用）。
触发器应该可以工作，你做错了什么。您可以将触发器更改为 _form.submit() 但它相同

【解决方案2】：

Bacchus，正如我在 cmets 中解释的那样，您可以这样做：

$(document).ready(function(){
       $('#submit').on('click', function(){
         $.ajax({
                url: url,
                type: 'POST',
                data: data,
                success: function (result) {
                   if(result == 'duplicate'){
                     $('#form').submit();
                   }else{
                     //your custom message here
                   }
                }
            });
       });
});

<form id='form' action='' method='post'>
  <!--your inputs here-->
  <a id='submit'>Submit form</a>
</form>

希望对你有帮助。

【讨论】：

重复检查应该在提交之前
将在使用 PHP 提交时进行检查。为什么投反对票？这是一个完美的解决方案。
投反对票，因为作者想在提交前检查重复
@СеменихинМаксим，他已经说过他在 PHP 中检查重复项。检查我和他之间关于他的问题的cmets，请收回你的反对票。