मैं किसी पृष्ठ से jQuery सत्यापन नियम कैसे जोड़ूं, हटा सकता हूं या स्वैप कर सकता हूं?

Question

नोट:
यह प्रश्न jQuery.validate() (संस्करण 1.5) का एक बहुत पुराना संस्करण है। यह प्लगइन अब ऐसा करने के लिए एक अंतर्निहित समाधान प्रदान करता है: .rules() method जिसका उपयोग इसके बजाय किया जाना चाहिए। मैं इस सवाल को छोड़ रहा हूं और ऐतिहासिक उद्देश्यों के लिए अपने मूल रूप में उत्तर दे रहा हूं, जो किसी विरासत साइट को बनाए रखने की आवश्यकता है जो jQuery और jQuery.validate() के नवीनतम संस्करणों में अपग्रेड करने में असमर्थ है।

---

मेरे पास एक ऐसा फॉर्म है जो इनपुट तत्वों को दृश्यमान करता है। मैं को केवल फॉर्म पर दृश्य तत्वों को मान्य करना चाहता हूं।

मुझे सही तरीके से कार्य करने में मुश्किल हो रही है। मैं गैर-दृश्य तत्वों के लिए वैधता अक्षम करना चाहता हूं और मुझे ऐसा करने का सबसे अच्छा तरीका पता नहीं लग रहा है। मेरे कोड के साथ क्या गलत हो सकता है, या मेरे दृष्टिकोण की कोई सराहना की जाएगी।

• $("form").rules("remove") कॉलिंग सभी मौजूदा सत्यापन नियमों स्पष्ट करने के लिए:

  जब दृश्यता चालू किए जाने पर, मैं कुछ चीजें कोशिश की है। यह एक "अपरिभाषित" जावास्क्रिप्ट अपवाद फेंकता है।

• दृश्य तत्वों के लिए $("form").validation(...options...) पर कॉल करके, उम्मीद है कि यह नियमों को ओवरराइट करेगा। यह केवल पहले समूह को अनुमति देता है जो काम के लिए मान्य है। दूसरा पैनल मान्य नहीं किया जा सकता है।
• नई validation() विधि को कॉल करने से पहले सबमिट हैंडलर को अनबाइंड करना। ऐसा नहीं किया जो मैंने सोचा था। यह सभी सत्यापन (प्रतीत होता है) स्थायी रूप से हटा देता है और फॉर्म सत्यापन के बिना सबमिट करता है।
• सत्यापनकर्ता को फिर से कॉल करने का प्रयास करने से पहले $.removeData($('form'), 'validator') के साथ सत्यापन ऑब्जेक्ट को साफ़ करना। यह भी काम नहीं करता है।
• यह इसलिए कई का उपयोग कर <form /> टैग सवाल से बाहर है के बाद से उस पृष्ठ टूट जाएगा, एक ASP.NET साइट में है।

मैं इस काम को कैसे बना सकता हूं इस पर स्टंप किया गया हूं। आप http://jsbin.com/ucibe3 पर मेरे पास एक पूर्ण कामकाजी डेमो देख सकते हैं, या इसे http://jsbin.com/ucibe3/edit पर संपादित कर सकते हैं। मैंने इसे पर पर खींचने की कोशिश की है जो कि बग का कारण बनता है।

मेरा कोड (पूरा काम कर पेज के लिए लिंक के ऊपर उपयोग) के प्रमुख पीस हैं

HTML:

<td id="leftform"> 
    Left Form<br /> 
    Input 1: <input type="text" name="leftform_input1" /><br /> 
    Input 2: <input type="text" name="leftform_input2" /><br /> 
    <input type="submit" name="leftform_submit" value="Submit Left" /> 
</td> 
<td id="rightform" style="visibility:hidden"> 
    Right Form<br /> 
    Input 1: <input type="text" name="rightform_input1" /><br /> 
    Input 2: <input type="text" name="rightform_input2" /><br /> 
    <input type="submit" name="rightform_submit" value="Submit Right" /> 
</td> 

जावास्क्रिप्ट:

$('#toggleSwitch').click(function() { 
    if ($('#leftform').css("visibility") !== "hidden") { 
     $('#leftform').css("visibility", "hidden"); 
     $('#rightform').css("visibility", "visible"); 
     $('form').validate({ 
      rules: { 
       rightform_input1: { required: true }, 
       rightform_input2: { required: true } 
      }, 
      messages: { 
       rightform_input1: "Field is required", 
       rightform_input2: "Field is required" 
      } 
     }); 
    } else { 
     $('#rightform').css("visibility", "hidden"); 
     $('#leftform').css("visibility", "visible"); 
     $('form').validate({ 
      rules: { 
       leftform_input1: { required: true }, 
       leftform_input2: { required: true } 
      }, 
      messages: { 
       leftform_input1: "Field is required", 
       leftform_input2: "Field is required" 
      } 
     }); 
    } 
}); 

Answer 1

अप्रचलित नोटिस:
इस उत्तर jQuery.validate() प्लगइन (संस्करण 1.5) की एक अत्यंत पुराने संस्करण को संदर्भित करता है और के रूप में प्लग इन को इस समस्या को हल करने के लिए एक आधिकारिक एपीआई प्रदान करता है अब अप्रचलित है। इसे हल करने के मौजूदा दृष्टिकोण के लिए .rules() documentation देखें। मैं इस उत्तर को छोड़ रहा हूं-किसी ऐसे व्यक्ति की मदद करना जो विरासत साइट को बनाए रखना चाहिए जो jQuery और jQuery.validate() के नवीनतम संस्करणों में अपग्रेड करने में असमर्थ है।

---

यह सत्यापनकर्ता कि अच्छी तरह से एपीआई में दर्ज नहीं किया गया है (और इस से मेरा मतलब है कि यह सब पर दर्ज नहीं किया गया है) की एक विशेषता का उपयोग करता है, हालांकि, क्योंकि यह कैसे काम करता है सत्यापनकर्ता का एक मूलभूत हिस्सा है, यह अनदेखा होने पर भी हटाया जाने की संभावना नहीं है।

एक बार जब आप jQuery सत्यापनकर्ता प्रारंभ कर लेते हैं, तो आप उस फॉर्म ऑब्जेक्ट पर validate() विधि को कॉल करके फिर से सत्यापनकर्ता ऑब्जेक्ट तक पहुंच प्राप्त कर सकते हैं जिसे आपने वैधकर्ता लागू किया है। इस सत्यापनकर्ता ऑब्जेक्ट में settings प्रॉपर्टी है, जो डिफ़ॉल्ट सेटिंग्स को संग्रहीत करती है, जो आपके द्वारा प्रारंभिक सेटिंग्स में लागू की गई सेटिंग्स के साथ मिलती है।

मान लिया जाये कि मैं इस तरह सत्यापनकर्ता प्रारंभ:

$('form').validate({ 
    rules: { 
     leftform_input1: { required: true }, 
     leftform_input2: { required: true } 
    }, 
    messages: { 
     leftform_input1: "Field is required", 
     leftform_input2: "Field is required" 
    } 
}); 

मैं तो ऐसा करके सत्यापनकर्ता से बाहर उन सटीक सेटिंग्स प्राप्त कर सकते हैं निम्नलिखित:

var settings = $('form').validate().settings; 

मैं तो आसानी से इस सेटिंग के साथ काम कर सकते हैं फॉर्म के लिए सत्यापनकर्ता जोड़ने या हटाने के लिए ऑब्जेक्ट।

इस तरह आप सत्यापन नियमों को दूर होता है:

var settings = $('form').validate().settings; 
delete settings.rules.rightform_input1; 
delete settings.messages.rightform_input1; 

और यह कैसे आप सत्यापन नियमों जोड़ना होगा है:

var settings = $('form').validate().settings; 
settings.rules.leftform_input1 = {required: true}; 
settings.messages.leftform_input1 = "Field is required"; 

---

यहाँ में परिदृश्य के लिए एक काम कर हल है मेरी सवाल। validate ऑब्जेक्ट के rules और messages गुणों को ओवरराइट करने के लिए मैं jQuery की extend() विधि का उपयोग करता हूं, इस प्रकार मैं दो पैनलों के बीच टॉगल करता हूं।

$('#toggleSwitch').click(function() { 
    var settings = $('form').validate().settings; 
    var leftForm = $('#leftform'); 
    var rightForm = $('#rightform'); 

    if (leftForm.css("visibility") !== "hidden") { 
     leftForm.css("visibility", "hidden"); 
     rightForm.css("visibility", "visible"); 
     $.extend(settings, { 
      rules: { 
       rightform_input1: { required: true }, 
       rightform_input2: { required: true } 
      }, 
      messages: { 
       rightform_input1: "Field is required", 
       rightform_input2: "Field is required" 
      } 
     }); 
    } else { 
     rightForm.css("visibility", "hidden"); 
     leftForm.css("visibility", "visible"); 
     $.extend(settings, { 
      rules: { 
       leftform_input1: { required: true }, 
       leftform_input2: { required: true } 
      }, 
      messages: { 
       leftform_input1: "Field is required", 
       leftform_input2: "Field is required" 
      } 
     }); 
    } 
}); 

Answer 2

जबकि वहाँ ऐसा करने के लिए अन्य तरीके हैं यह एएसपीनेट आपको कई फॉर्म टैग्स का उपयोग करने की अनुमति देता है जब तक कि वे सभी प्रस्तुत नहीं किए जाते हैं - इसलिए यदि आप केवल प्रासंगिक सामग्री को प्रदर्शित करने के लिए एक बहु दृश्य का उपयोग करते हैं तो आप एकाधिक रूपों का उपयोग कर सकते हैं।

यह सत्यापन को साफ करने और थोड़ा सा संभालने के लिए प्रस्तुत करता है।

---

वैकल्पिक रूप से jQuery अनुमति नहीं है: दिखाई, अपने चयनकर्ता में जोड़े जाने की ताकि आप संभावित ही दिखाई तत्वों पर चयनकर्ता चलाने के लिए और इस मुद्दे से बचने कि जिस तरह से वे कैसे छिपे हुए हैं पर निर्भर करता है हो सकता है।

कैसे: jQuery 1.3.2 में दृश्यमान गणना की गई थी। तत्व को दृश्यमान माना जाता है अगर यह और उसके माता-पिता दस्तावेज़ में स्थान का उपभोग करते हैं। सीएसएस दृश्यता को ध्यान में नहीं रखा जाता है। रिलीज नोट्स में बदलावों को और विस्तार से रेखांकित किया गया है। अपने नियमों में दिखाई दे:

---

यहाँ ढेर पर एक और पोस्ट से एक बेहतर/सरल समाधान overflow-

जाहिर सत्यापन प्लग में आप निर्दिष्ट करने के लिए अनुमति देता है। यहाँ पोस्ट

Advanced JQuery Validation: Avoiding Validations on Certain Conditions

Answer 3

validate.rules हैश के अंदर "आवश्यक" घोषणाओं स्थिर के रूप में "सही" घोषित करने की जरूरत नहीं है है। आप वास्तव में एक अज्ञात फ़ंक्शन की आपूर्ति कर सकते हैं जो किसी चीज़ की दृश्यता की जांच कर सकता है और उत्तर के आधार पर सही या गलत लौटा सकता है।

$('form').validate({ 
rules: { 
    rightform_input1: { 
    required: function(){ 
       return $('#leftform').css("visibility") !== "hidden" 
       } }, 
    rightform_input2: { 
    required: function(){ 
       return $('#leftform').css("visibility") !== "hidden" 
       } } 
    } 
}); 

Answer 4

$('#form_id').validate();//empty rules 
//add rules/message to form element 
$('#form_id #inputId').rules("add", { 
    required  : true,        
    messages  : { 
     required : 'Add your required message' 
    } 
}); 

Answer 5

मैं editting नियमों के लिए छोटा सा समारोह (केवल आवश्यक) लिखा था।

 $.editRules = function($array, $type) { 
      var settings = $('#signupForm').validate().settings; 
      $.each($array, function($k, $v) { 
       settings.rules[$v] = {required: ($type == 'add' ? true : false)}; 
      }); 
     }; 

Answer 6

आप नई सेटिंग (नियम, संदेशों ... आदि) कॉल

$('#formid').removeData('validator') 

यह सत्यापन फार्म के लिए उसके बाद फिर से नए के साथ निकाल देंगे यह प्रारंभ के साथ फिर से मान्य कॉल करने के लिए चाहते हैं सेटिंग्स