Question

我创建了一个表单。在提交表单时，我发出ajax请求，告诉我数据是否有效。我想要做的是，如果ajax响应告诉数据有效，那么它应该提交表单，但如果数据无效，那么它不应该提交表单。

$('#agentLogin').submit(function(ev){
       ev.preventDefault();
       var username=$('#agentEmail').val();
       var password=$('#agentPassword').val();
       $.ajax({
           url: '<?php echo $this->createAbsoluteUrl('site/agentLogin'); ?>',
           type: 'POST',
           data: {
               email: username,
               pwd: password
           },
           success: function(data){
               if(data === 'invalid'){
                   $('#agentLoginStatus').html('Invalid Username and password');
               }else if(data === 'deactivated'){
                   $('#agentLoginStatus').html('Account is deactivated');
               }else if(data === 'valid'){
                   // submit form here
               }
           }
       });
    });

问题： - 当数据无效时，它不会提交表单。但如果数据有效，那么它也不会提交表格。我该如何解决这个问题？

已经尝试过： -

$(this).submit();
return true;

Answer 1

尝试这种方法：

$('#agentLogin').submit(function (ev, submit) {

    if (!submit) {

        ev.preventDefault();

        var username = $('#agentEmail').val(),
            password = $('#agentPassword').val(),
            $form = $(this);

        $.ajax({
            url: 'url',
            type: 'POST',
            data: {
                email: username,
                pwd: password
            },
            success: function (data) {
                if (data === 'invalid') {
                    $('#agentLoginStatus').html('Invalid Username and password');
                }
                else if (data === 'deactivated') {
                    $('#agentLoginStatus').html('Account is deactivated');
                }
                else if (data === 'valid') {
                    $form.trigger('submit', [true]);
                }
            }
        });
    }
});

它没有使用原始代码的原因是，当您尝试调用$(this).submit()时，它会触发相同的事件处理程序，它会尝试再次使用AJAX请求进行验证，并且从不实际提交表单。要解决这个问题，您需要以某种方式告诉事件处理程序，当您手动提交表单时，您不再需要运行验证。我正在为此传递其他参数：

$form.trigger('submit', [true]);

Answer 2

您可以继续使用native .submit() method提交<form>，该only start the default action应该without rerunning event bindings之前已被阻止submit。

submit()方法在调用时，必须fire a simple event来自form元素本身的form元素，并使用submit()方法提交标志设置。

5）如果未设置从submit()方法标记提交的，那么{em> {{{3}}冒泡且可取消名为submit的<{3>} {1}} 的。 [...]

但是，您还需要将form的引用存储为<form>，this之间通常会有所不同，包括嵌入式回调。

function

Answer 3

$('#agentLogin').submit(function(ev){
   var myForm=$(this);
   if(myForm.data("action")=="submit"){
    return true;
   }
   ev.preventDefault();
   var username=$('#agentEmail').val();
   var password=$('#agentPassword').val();
    $.ajax({
       url: '<?php echo $this->createAbsoluteUrl('site/agentLogin'); ?>',
       type: 'POST',
       data: {
           email: username,
           pwd: password
       },
    success: function(data){
           if(data === 'invalid'){
               $('#agentLoginStatus').html('Invalid Username and password');
               return false;
           }else if(data === 'deactivated'){
               $('#agentLoginStatus').html('Account is deactivated');
           }else if(data === 'valid'){
               myForm.data("action","submit");
               myForm.submit();
           }
       }

 });

Answer 4

$('#agentLogin').submit(function(ev){
   var myForm=$(this);
   if(myForm.data("action")=="submit"){
    return true;
   }
   ev.preventDefault();
   var username=$('#agentEmail').val();
   var password=$('#agentPassword').val();
    $.ajax({
       url: '<?php echo $this->createAbsoluteUrl('site/agentLogin'); ?>',
       type: 'POST',
       data: {
           email: username,
           pwd: password
       },
    success: function(data){
           if(data === 'invalid'){
               $('#agentLoginStatus').html('Invalid Username and password');
           }else if(data === 'deactivated'){
               $('#agentLoginStatus').html('Account is deactivated');
           }else if(data === 'valid'){
               $("hidensubmitbutton").click();

//and the form will be submited
           }
       }

 });

Answer 5

这里我们可以使用ajax的submithandler。原因是submithandler使用提交按钮并验证数据..

根据ajax响应提交表单

5 个答案: