2012-07-05 34 views
6

Tôi đang sử dụng xác thực jquery cho biểu mẫu đăng ký của mình, nó hoạt động hoàn hảo nhưng tôi đang gặp sự cố. Tôi kiểm tra xem email có tồn tại hay không, nếu một email tồn tại, tôi nhận được thông báo lỗi. Bây giờ tôi muốn chỉnh sửa điều này, vì vậy, nếu email được sử dụng miễn phí. Thông báo lỗi sẽ thay đổi thành: Email này được sử dụng miễn phí.Biểu mẫu xác thực jQuery Quy tắc từ xa, thông báo thành công

$(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") 
      }, 
     }, 
    }); 
}); 

Thông báo hoạt động nhưng thông báo này phải xuất hiện trong nhãn nơi có lỗi. Điều này có thể không?

+0

Thử không có id phần tử biểu mẫu. Có thể bạn có thể sử dụng bộ chọn lớp cho (các) đối tượng mẫu đích. Như thế này; $ (". selector") .xác nhận ({ gỡ lỗi: true }) Vì vậy, bạn có thể lấy phần tử "id" không hợp lệ. Sau đó, bạn có thể nối thông điệp vào đối tượng đích. Chi tiết khác http://docs.jquery.com/Plugins/Validation/validate#options – Kerberos

Trả lời

2

Bạn có thể sử dụng tùy chọn success.

Nếu được chỉ định, nhãn lỗi được hiển thị để hiển thị phần tử hợp lệ. Nếu một chuỗi được đưa ra, nó được thêm vào như là một lớp cho nhãn. Nếu một hàm được đưa ra, nó được gọi với nhãn (như một đối tượng jQuery) và đầu vào được xác thực (như một phần tử DOM). Nhãn có thể được sử dụng để thêm văn bản như “ok!”.

Ví dụ trong tài liệu: Thêm lớp “hợp lệ” vào các phần tử hợp lệ, được tạo kiểu qua CSS và thêm văn bản “Ok!”.

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

Trong mã của bạn:

$(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 
     }, 
    }); 
}); 

Tôi đề nghị đọc: .validate()

3

@Ruub: Thông điệp từ xa phải là một chức năng, và điều khiển từ xa trong quy tắc chỉ là một url để kiểm tra Ví dụ:

$("#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()) } 
     }, 
    }, 
}); 

Trong phía máy chủ (bao gồm/check_email.php):

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

I`v tìm thấy giải pháp cho vấn đề của chúng tôi, một dành một ngày cho tất cả các giải pháp tồn tại nhưng không ai hài lòng với tôi và tìm hiểu một mã nguồn chút jqvalidator tôi thấy rằng nó rất dễ dàng để nhận ra nó

$("#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 - mọi thứ đều hoàn hảo!

Mã này đã được thử nghiệm với jqvalidation 1.14.0

Tôi hy vọng, tôi có thể giúp ai đó

0

Thay dưới mã với chức năng hoàn chỉnh của bạn:

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

Vui lòng kiểm tra này nó sẽ được Cứu giúp.

Các vấn đề liên quan