Jquery सत्यापन त्रुटि प्लेसमेंट (रेडियो बटन)

Question

मैं अपने फॉर्म को प्रमाणित करने के लिए Jquery सत्यापन प्लगइन का उपयोग करने का प्रयास कर रहा हूं। मेरे पास मेरे अधिकांश इनपुट तत्वों के दाईं ओर आने वाले त्रुटि संदेश हैं, लेकिन रेडियो बटन मुझे परेशानी के अलावा कुछ भी नहीं दे रहे हैं।

यदि मैं div.group वर्ग के लिए चौड़ाई नहीं देता हूं, तो पूर्ण संदेश के बाहर त्रुटि संदेश दिखाई देता है (क्योंकि मुझे लगता है कि div चौड़ाई पृष्ठ का 100% है?) कुछ भी नहीं करने से कारण नहीं होता है दूसरे के बजाय पहले रेडियो बटन के बाद प्रकट होने के लिए त्रुटि संदेश। मैं चौड़ाई को हार्डकोड नहीं कर सकता, क्योंकि मैं इसे कई चौड़ाई के रेडियो समूहों पर उपयोग करना चाहता हूं। रेडियो बटन में रेडियो बटन समाप्त होने पर मैं इसे दाएं किनारे पर कैसे दिख सकता हूं?

धन्यवाद!

var validator = $("#myForm").validate({ 
     errorElement: "div", 
     wrapper: "div", // a wrapper around the error message 
     errorPlacement: function(error, element) { 

      if (element.parent().hasClass('group')){ 
       element = element.parent(); 
      } 


      offset = element.offset(); 
      error.insertBefore(element) 
      error.addClass('message'); // add a class to the wrapper 
      error.css('position', 'absolute'); 
      error.css('left', offset.left + element.outerWidth()); 
      error.css('top', offset.top); 
    } 
}); 

और फिर

<p> 
    <div class="group"> 
     <label>Gender</label> 
     Male: <input id="gender_male" type="radio" name="gender" class="required" value="Male" /> 
     Female: <input id="gender_female" type="radio" name="gender" class="required" value="Female" /> 
    </div> 

हो सकता है कि सिर्फ एक रास्ता त्रुटि संदेश दिखाई देते समूह की अंतिम रेडियो बटन के बाद? अगर मैं अंतिम तत्व को संभाल सकता हूं, तो मैं ऑफसेट को तदनुसार बदल सकता हूं।

संपादित करें: आह, मैंने अभी div.group {display: inline-block;} का उपयोग किया है।

Answer 1

आप जहां भी चाहें किसी विशिष्ट फ़ील्ड के लिए त्रुटि रखने के लिए इस विधि का उपयोग भी कर सकते हैं।

errorPlacement: function(error, element) { 
    if (element.attr("name") == "PhoneFirst" || element.attr("name") == "PhoneMiddle" || element.attr("name") == "PhoneLast") { 
    error.insertAfter("#requestorPhoneLast"); 
    } else { 
    error.insertAfter(element); 
    } 
}, 

Answer 2

इसे आजमाएं। यह त्रुटि उत्पन्न होने वाली वस्तु से पहले त्रुटि रखता है। यदि आप आवश्यक रूप से पहला रेडियोधटन सेट करते हैं, तो यह काम करेगा। स्थिरता के लिए मैंने इस इनपुट को सभी इनपुट प्रकारों पर निष्पादित करना चुना है, लेकिन आप इस क्रिया को केवल तभी करने के लिए स्क्रिप्ट को ट्विक कर सकते हैं जब एक रेडियोग्रुप सत्यापन विफल हो जाता है।

$('form').validate({ 
    errorPlacement: 
    function(error, element){ 
    var id=element[0]['id']; 
    $(element).before("<label for='"+id+"' class='error'>"+error.text()+"</label>"); 
    } 
}); 

Answer 3

न भी जे एस errorPlacement यह सब करने की ज़रूरत ... अगर सिर्फ रेडियो बटन के लिए एक लेबल जगह भी तो की तरह काम करता है:

<label class="label_radio" for="answer_A"> 
    <input id="answer_A" name="answers[question1].choiceArray" type="radio" value="A"/>Yes 
</label> 
<label class="label_radio" for="answer_B"> 
    <input id="answer_B" name="answers[question1].choiceArray" type="radio" value="B"/>No 
</label> 

<label for="answers[question1].choiceArray" class="error" style="display:none;">* Please pick an option above</label> 

jQuery के मान्यकरण प्लगइन स्वचालित रूप से इसे सामने लाने और प्रदर्शित करेगा " आवश्यक "मैसेज।

Answer 4

बस कुछ सीएसएस का उपयोग करें:

#myform div.group label.error {float:right;padding-left:10px;}