表單提交之前的jQuery驗證

Question

嘿，我正在嘗試使用Ajax驗證表單。

驗證正確后，我希望表單提交。

否則，我想顯示反饋等。

但是有時我會遇到無休止的循環，或者表單無法提交。

我該如何解決這個問題？

//Find Sign form
var sign_form = $("#sign_form");

//User submits Sign form
sign_form.submit(function(e) {
    e.preventDefault();

    var $this = $(this);

    var form = $(this).serializeArray();
    var formObj = {};
    $.each(form,
        function(i, v) {
            formObj[v.name] = v.value;
        });

    //Post Form data to Sign
    $.post("./ajax/sign.php", formObj, function(data, status) {
        var fdb = data.messages;
        if(data.status == "success") {

            console.log("validate is TRUE");
            $this.submit();

            return true;
        } else {

            if(fdb.emailaddress != null) {
                $("#fdb_emailaddress").html(fdb["emailaddress"]);
            }

            console.log("validate is FALSE");
            return false;
        }
    });

    console.log("validate ended: we should not see this");
});

Answer 1

當然，submittenn會陷入無休止的循環-因為您在綁定到Submit（）的函數內觸發了commit（）... ;-)您必須以某種方式保存“已經進行驗證”的信息，以便例如通過數據屬性或data（）進行響應。 例如：

//Find Sign form
var sign_form = $("#sign_form");

//User submits Sign form
sign_form.submit(function(e) {

  var $this = $(this);
  if($this.data("validated") === true) return true;

  e.preventDefault();

  var form = $(this).serializeArray();
  var formObj = {};
  $.each(form,
    function(i, v) {
        formObj[v.name] = v.value;
    });

  //Post Form data to Sign
  $.post("./ajax/sign.php", formObj, function(data, status) {
    var fdb = data.messages;
    if(data.status == "success") {

        console.log("validate is TRUE");
        $this.data("validated", true);
        $this.submit();

        return true;
    } else {

        if(fdb.emailaddress != null) {
            $("#fdb_emailaddress").html(fdb["emailaddress"]);
        }

        console.log("validate is FALSE");
        return false;
    }
  });

  console.log("validate ended: we should not see this");
});