jQuery驗證表單遠程規則，成功消息

Question

我正在使用jquery驗證我的註冊表單，它工作正常，但我遇到了問題。我檢查電子郵件是否存在，如果電子郵件確實存在，我收到一條錯誤消息。現在我想編輯這個，所以，如果電子郵件是免費使用的。錯誤消息將變爲：此電子郵件可免費使用。

$(document).ready(function(){ 
    $("#registratieform").validate({ 
     rules: { 
      email: { 
       required: true, 
       email: true, 
       remote: { 
        url: "includes/check_email.php", 
        type: "post", 
        complete: function(data){ 
         if(data.responseText == "false") { 
          alert("Free"); 
          } 
        } 
       }, 
      }, 
     }, 

     messages: { 
      email: { 
       required: "This field is required", 
       email: "Please enter a valid email address", 
       remote: jQuery.format("{0} is already taken") 
      }, 
     }, 
    }); 
}); 

警報有效，但是此消息必須出現在出現錯誤的標籤中。這可能嗎？

Answer 1

您可以使用success選項。

如果指定，則顯示錯誤標籤以顯示有效元素。如果給出一個字符串，它將作爲一個類添加到標籤中。如果給出了一個函數，它會被標籤（作爲一個jQuery對象）和經過驗證的輸入（作爲一個DOM元素）調用。該標籤可用於添加「OK！」等文字。

doc中的示例：向有效元素添加一個類「valid」，通過CSS設置樣式，並添加文本「Ok！」。

$("#myform").validate({ 
    success: function(label) { 
     label.addClass("valid").text("Ok!") 
    }, 
    submitHandler: function() { alert("Submitted!") } 
}); 

在您的代碼：

$(document).ready(function(){ 
    $("#registratieform").validate({ 
     rules: { 
      email: { 
       required: true, 
       email: true, 
       remote: { 
        url: "includes/check_email.php", 
        type: "post", 
        complete: function(data){ 
         if(data.responseText == "false") { 
          alert("Free"); 
          } 
        } 
       }, 
      }, 
     }, 

     messages: { 
      email: { 
       required: "This field is required", 
       email: "Please enter a valid email address", 
       remote: jQuery.format("{0} is already taken") 
      }, 
     }, 

     success: function(e) { 
      // Remove error message 
      // Add success message 
     }, 
    }); 
}); 

我推薦閱讀：.validate()

Answer 2

@Ruub： 遠程消息應該是一個功能，並在規則只是一個URL的遠程辦理登機手續例如：

$("#registratieform").validate({ 
    rules: { 
     email: { 
      required: true, 
      email: true, 
      remote: "includes/check_email.php"      
     } 
    }, 
    messages: { 
     email: { 
      required: "This field is required", 
      email: "Please enter a valid email address", 
      remote: function() { return $.validator.format("{0} is already taken", $("#email").val()) } 
     }, 
    }, 
}); 

在服務器端（包括/ check_email.php）：

if (!isValidEmail($_REQUEST['email'])) { 
     echo "false"; 
     exit; 
    } 

Answer 3

I`v發現我們的問題的解決方案，一花一天時間到所有存在的解決方案，但沒有人能讓我滿意，並學習jqvalidator的位的源代碼，我發現這是很容易實現它

$("#myform").validate({ 
     rules: { 
      somealiasname: { 
       required: true, 
       remote: { 
        url: "www.callthisurl.com/remote", 
        type: "GET", 
        success: function (data) {// Here we got an array of elements for example 
         var result = true, 
          validator = $("#myform").data("validator"), //here we get the validator for current form. We shure that validator is got because during initialization step the form had stored validator once. 
          element = $("#myform").find("input[name=somealiasname]"), 
          currentAlias = element.val(), 
          previous, errors, message, submitted; 

         element = element[0]; 
         previous = validator.previousValue(element); // here we get the cached value of element in jqvalidation system 

         data.forEach(function (it) {//here we check if all alias is uniq for example 
          result = !result ? false : it.alias != currentAlias; 
         }); 

         validator.settings.messages[element.name].remote = previous.originalMessage; // this code I found in the source code of validator (line 1339) 

         if (result) { 
          submitted = validator.formSubmitted; 
          validator.prepareElement(element); 
          validator.formSubmitted = submitted; 
          validator.successList.push(element); 
          delete validator.invalid[element.name]; 
          validator.showErrors(); 
         } else { 
          errors = {}; 
          message = validator.defaultMessage(element, "remote"); 
          errors[element.name] = previous.message = $.isFunction(message) ? message(value) : message; 
          validator.invalid[element.name] = true; 
          validator.showErrors(errors); 
         } 

         previous.valid = result; 
         validator.stopRequest(element, result); 
        }.bind(this) 
       } 
      } 
     } 

```

tadam - 一切都是完美的！

此代碼已經過測試與jqvalidation 1.14.0

我希望，我能幫助別人

Answer 4

替換下面的代碼與完整的功能：

dataFilter: function (data) { 
         return 'false';// If email not exist 
         return 'true';// If email exist (Display message on return true) 
        } 

請檢查這將是幫幫我。