2013-02-09 14 views
5

मैं किसी फ़ॉर्म को सत्यापित करने के लिए jQuery सत्यापन का उपयोग कर रहा हूं, और मैं यह करना चाहता हूं कि यह है ... मैं इसे सेट करना चाहता हूं ताकि एक चेकबॉक्स को एक संपादन बॉक्स से चेक किया गया हो उदाहरण के लिए, अलग से मान्य है।चेकबॉक्स चेक किए जाने पर एक jQuery सत्यापन नियम को गतिशील रूप से बदलना

यह है कि यह कैसे करता है, तो चेकबॉक्स चेक नहीं किया है को मान्य किया जाना चाहिए:

weight: { required: true, max: 50 } 

यह है कि यह कैसे करता है, तो यह चेक किया जाता है मान्य किया जाना चाहिए।

weight: { required: true, max: 100 } 

कोई विचार?

उत्तर

7

जब भी चेकबॉक्स क्लिक किया जाता है तो आप गतिशील रूप से नियम बदलने के लिए Validate plugin's built-in rules('add') method का उपयोग करेंगे।

jQuery:

$(document).ready(function() { 

    // initialize the plugin 
    $('#myform').validate({ 
     // other options, 
     rules: { 
      // other rules, 
      weight: { 
       required: true, 
       max: 50 // initial value on load 
      } 
     } 
    }); 

    // change the rule on checkbox and update displayed message dynamically 
    $('#check').on('change', function() { 
     if ($(this).is(':checked')) { 
      $('#weight').rules('add', { 
       max: 100 
      }); 
     } else { 
      $('#weight').rules('add', { 
       max: 50 
      }); 
     }; 
     $('#weight.error').each(function() { 
      $(this).valid(); 
     }); 
    }); 

}); 

एचटीएमएल:

<form id="myform"> 
    <input type="checkbox" id="check" /> 
    <input type="text" id="weight" name="weight" /> 
    <input type="submit" /> 
</form> 

कार्य डेमो: http://jsfiddle.net/3hGxS/

3

max विधि और एक पा के रूप में एक समारोह का उपयोग करके नियम बनाओ rameter। फ़ील्ड मान्य होने पर इसका मूल्यांकन किया जाएगा, यानी जब तत्व() को फ़ील्ड पर कॉल किया जाता है।

नियम परिभाषा इस

rules: { 
    field1: 
    { 
     required: true, 
     max: function() { return $("#mycheckbox:checked").length ? 100 : 50; } 
    } 
} 

भी तरह लग रहा है, लक्ष्य क्षेत्र को दोबारा सत्यापित जब नियम परिवर्तन या आपको लगता है कि नहीं रह गया है कि यह केवल revalidates लागू होता है

$('#mycheckbox').on('change', function() { 
    $('#field1.error').each(function() { 
     $(this).valid(); 
    }); 
}); 

टिप्पणी एक त्रुटि संदेश के साथ छोड़ा जा सकता है फ़ील्ड अगर यह पहले ही मान्य है, तो डिफ़ॉल्ट त्रुटि की उपस्थिति की जांच करें 'त्रुटि'।

तरह एचटीएमएल साथ

इस

<input name="mycheckbox" id="mycheckbox" type="checkbox" /> 
<input name="field1" id="field1"> 
<input type="submit" /> 

पूर्ण जावास्क्रिप्ट कोड इस तरह है, find the fiddle here

$(function() { 

    $("form").validate({ 
     rules: { 
      field1: 
      { 
      required: true, 
      max: function() { 
        return $("#mycheckbox:checked").length ? 100 : 50; 
       } 
      } 
     }, 
     submitHandler: function() { 
      alert('form ok'); 
     } 
    }); 

    $('#mycheckbox').on('change', function() { 
     $('#field1.error').each(function() { 
      $(this).valid(); 
     }); 
    }); 

}); 
संबंधित मुद्दे