Jquery सत्यापन - इनपुट तत्व में नियम जोड़ने पर त्रुटि?

Question

मैं http://docs.jquery.com/Plugins/Validation साथ Jquery सत्यापन को लागू करने की कोशिश कर रहा हूँ:

मेरे डिजाइन योजना:

• मेरे इनपुट तत्व:

  <form action="submit.php" id="form_id"> 
      <input type="text" class="val-req" id="my_input" name="myval" /> 
      <input type="button" onclick="validate_form('form_id', function() { $('#form_id').submit(); })" /> 
      <span id="val-msg" class="my_input"></span> 
  </form> 
  

• फिर, डोम तैयार पर:

  $(document).ready(function() { 
           $('.val-req').rules('add', {required:true}); 
          }); 
  

• मान्य विधि:

  function validate_form(form_id, callback) { 
       var form = $('#'+form_id); 
       $('.val-req').each(function() {$(this).rules('add', {required:true});}); 
       $(form).validate({ 
         errorElement: "span", 
         errorClass: "val-error", 
         validClass: "val-valid", 
         errorPlacement: function(error, element) { 
               $('#val-msg.'+$(element).attr('id')).innerHTML(error.html()); 
             }, 
         submitHandler: callback 
       }); 
  } 
  

मेरी उम्मीदों के अनुसार, यह रूप में स्थान धारक सी अवधि में त्रुटि संदेश प्रदर्शित करना चाहिए।

लेकिन, समस्या

Error on Chrome-Console: Uncaught TypeError: Cannot read property 'settings' of undefined

यह भी अन्य ब्राउज़र पर त्रुटि दे रहा है। > यह सही होना चाहिए -

$('.val-req').rules('add', {required:true}); # This is causing the error 

के रूप में, मेरी समझ और प्रलेखन प्रति: फिर, मैं समझ से बाहर करने के लिए समस्या की और पाया की कोशिश की।

इसका कारण टाइपरर क्यों होगा और इसे हल करने के लिए मैं क्या कर सकता हूं?

Answer 1

मुझे लगता है कि आपका कोड इसकी तुलना में अधिक जटिल है। तुम बस दस्तावेज़ तैयार पर validate कॉल करने के लिए होना चाहिए (आपके प्रपत्र संभालने दस्तावेज़ तैयार पर मौजूद है):

$(document).ready(function() { 
    $(".val-req").addClass("required"); 
    $("#form_id").validate({ 
     errorElement: "span", 
     errorClass: "val-error", 
     validClass: "val-valid", 
     errorPlacement: function(error, element) { 
      $('#val-msg.' + $(element).attr('id')).html(error.html()); 
     }, 
     submitHandler: function() { 
      this.submit(); 
     } 
    }); 
});​ 

उदाहरण:http://jsfiddle.net/4vDGM/

तुम भी बस को जोड़ने के बजाय आवश्यक तत्वों को required के एक वर्ग सकता है उन्हें जावास्क्रिप्ट के माध्यम से जोड़ना।

एक और बात तुम कर सकते हो validate के विकल्पों में से नियम वस्तु में नियम जोड़ने है:

$(document).ready(function() { 
    $("#form_id").validate({ 
     rules: { 
      myval: "required" 
     }, 
     errorElement: "span", 
     errorClass: "val-error", 
     validClass: "val-valid", 
     errorPlacement: function(error, element) { 
      $('#val-msg.' + $(element).attr('id')).html(error.html()); 
     }, 
     submitHandler: function() { 
      this.submit(); 
     } 
    }); 
});​ 

उदाहरण:http://jsfiddle.net/GsXnJ/

Answer 2

आप नियम जोड़ने के लिए के बाद आप सत्यापित करें प्लगइन कॉल फॉर्म तत्व में:

$("form").validate() 
$(yourElement).rules("add", {...}) 

Answer 3

अपराधी विधि प्रतिनिधि(), डब्ल्यू hich जाँच नहीं करता है एक सत्यापनकर्ता मौजूद है या नहीं:

function delegate(event) { 
    var validator = $.data(this[0].form, "validator"), 
    eventType = "on" + event.type.replace(/^validate/, ""); 
    // this fixes handling the deleted validator: 
    if (!validator) return; 
    validator.settings[eventType] && validator.settings[eventType].call(validator, this[0], event); 
} 

मैं एक समाधान के लिए खोज रहा था और एक ब्लॉग पोस्ट में यह पाया।

स्रोत: http://devio.wordpress.com/2012/07/18/fixing-jquery-validation-with-changing-validators/

Answer 4

मैं एक रूप है कि पहले से ही मान्यता स्थापित किया जा रहा था पर नियमों को संशोधित करने की कोशिश कर रहा था, लेकिन मैंने पाया मेरी $ (document) .ready (...) कोड मुख्य पहले क्रियान्वित किया गया था फॉर्म सत्यापन स्थापित किया गया था, इसलिए एक छोटा सेटटाइमआउट जोड़ने के लिए इस मुद्दे को मेरे लिए ठीक किया गया - उदाहरण के लिए

setTimeout(function() { 
    $(yourElement).rules("add", {...}) 
}, 100);