提交常规表单前的AJAX请求

我有一个jQuery表单验证脚本，在用户试图提交时执行。我想要在表单验证之后但发送之前执行（并完成）AJaX请求的另一个函数。提交常规表单前的AJAX请求

这是脚本。当单独调用时，函数可以正常工作;即不是来自submit()功能的内部。

zglosip（）; （函数，我想叫）

function zglosip() { 
     $.ajax({ 
      type : 'post', 
      url : 'res/php/nZglos.php', 
      data : { 
      "erepid" : "111", 
      "ip" : "222", 
      "poz" : "333" 
      }, 
      success : function(data, textStatus, jqXHR) { 
      tempor.html(data); 
      }, 
      error : function(XMLHttpRequest, textStatus, errorThrown) { 
      tempor.html(errorThrown); 
      }, 
      dataType : 'text' 
      return true; 
     }); 
    };

验证脚本（通过净莲Rapini创建和修改由我）

极& tempor是包含一些div的名字变量

正如你已经发现的，我试图在zglosIp()返回true（if st）后返回true的submit()函数在脚本的底部）。这不起作用，我也尝试了在其中单独调用zglosip()，其中有function{return true}，但是我确实没有正确使用它。请帮帮我。

来源

2013-07-26 Grzegorz G.

tempor.html（data）;应该是$（“＃tempor”）。html（data）;你应该有

– Hackerman

您想先确保表单未被提交，然后运行您的ajax调用，如果调用成功，请继续提交。注意我从zgoslip中删除了ajax调用，并将其放入窗体的提交处理程序中。你可以重组它，你想要的方式：我不得不删除从按钮提交类型

$('form').submit(function(e) { 

    // this code prevents form from actually being submitted 
    e.preventDefault(); 
    e.returnValue = false; 

    // some validation code here: if valid, add podkres1 class 

    if ($('input.podkres1').length > 0) { 
     // do nothing 
    } else { 

     var $form = $(this); 

     // this is the important part. you want to submit 
     // the form but only after the ajax call is completed 
     $.ajax({ 
      type: 'post', 
      url: someUrl, 
      context: $form, // context will be "this" in your handlers 
      success: function() { // your success handler 
      }, 
      error: function() { // your error handler 
      }, 
      complete: function() { 
       // make sure that you are no longer handling the submit event; clear handler 
       this.off('submit'); 
       // actually submit the form 
       this.submit(); 
      } 
     }); 
    } 
});

来源

2013-07-26 16:10:35 quekshuy

zglosip（）函数的内容可以像你那样做，没关系。感谢您的意见，我明白代码是如何工作的（我认为是这样，至少:)）。而且我还有一个问题：完成后的代码：当ajax调用会成功并且失败时，它们都会执行吗？通话条件是通话完成，我说得对吗？编辑：好的，找到它：http://api.jquery.com/jQuery.ajax/感谢您的帮助！ –

我有一个问题：你能否简要解释我，为什么表单在提交后不能重定向？或者，你能告诉我哪些代码应该学习更多知道吗？顺便说一句，这没关系;甚至更好;提交表单不会将我重定向到任何地方:) –

表单因两行不重定向： e.preventDefault（）; e.returnValue = false; 它可以防止发生默认操作。（因此'preventDefault'）。上面的代码应该清除表单的“submit”事件处理程序，并在ajax调用完成后重新提交。这在完整处理程序的2行中完成。 – quekshuy

在我的情况，然后我不得不称之为检查我不得不提交数据的有效性的方法。

<input type="button" value="Save" class="btn btn-success" id="submitbutton" />

然后我写了，做了检查，如果我必须停止，并要求继续返回true的方法：

public ActionResult CheckBeforeSubbmission(datatype var1) 
{ 
    if(var1>0) 
     return Json(new { result1 = true }); 
    else 
     return Json(new { result1 = false }); 
}

之后，我加入的JavaScript/AJAX下面的代码：

$("#submitbutton").click(function (e) { 

     var self = $('#form'); 
     //A value from the form to post to the controller 
     var var1 = $('#var1elementid').val(); 


     $.ajax({ 
      type: "POST", 
      url: "/SomeController/CheckBeforeSubbmission", 
      data: { 
       var1: var1 
      },success: function (response) { 
       if (response.result1) { 
        bootbox.confirm({ 
         message: "The check failed! Do you want to submit?", 
         buttons: { 
          confirm: { 
           label: 'Yes', 
           className: 'btn-success' 
          }, 
          cancel: { 
           label: 'Cancel', 
           className: 'btn-danger' 
          } 
         }, 
         callback: function (result) { 
          if (result) { 
           self.submit(); 
          } else { 
           bootbox.hideAll(); 
           return false; 
          } 
          return false; 
         } 
        }); 
       } else { 
        self.submit(); 
       } 
      }, 
      cache: false 
     }); 
    });

来源

2017-12-07 12:18:55

提交常规表单前的AJAX请求

回答

相关问题