ग्रुपिंग चेकबॉक्स और प्रत्येक समूह में अधिकतम तीन की जांच करने की अनुमति दें

Question

मैं एक ऐसा एप्लिकेशन लेना चाहता हूं जहां उपयोगकर्ता मनमानी व्यक्तियों के लिए डेटा दर्ज करेगा। प्रत्येक व्यक्ति के पास अधिकतम छह में से तीन विकल्प होंगे। मैं किसी भी अनिवार्य पर jquery का उपयोग कर अधिकतम तीन विकल्पों को कैसे बल देना चाहता हूं, इस बारे में सहायता चाहता हूं।

यहाँ एक नमूना कोड

<div id="subscriber_1"> 
    <input type=checkbox name=national> 
    <input type=checkbox name=international> 
    <input type=checkbox name=business> 
    <input type=checkbox name=entertainment> 
    <input type=checkbox name=religion> 
    <input type=checkbox name=sports> 
</div> 

ग्राहकों 20 तक की तरह subscriber_1, subscriber_2, ... subscriber_20 चला सकते हैं, है। मैं आपकी सहायता के लिए आभारी रहूंगा।

Answer 1

आप अपने ग्राहक divs करने के लिए एक वर्ग जोड़ना चाहिए, यह आसान ईवेंट हैंडलर्स संलग्न करने के लिए बनाने के लिए:

<div id="subscriber_1" class="subscriber">...</div> 
<div id="subscriber_2" class="subscriber">...</div> 

और यह jQuery का उपयोग करें:

$('.subscriber :checkbox').change(function() { 
    var $cs = $(this).closest('.subscriber').find(':checkbox:checked'); 
    if ($cs.length > 3) { 
     this.checked = false; 
    } 
}); 

jsFiddle Demo

स्पष्टीकरण : इन चेकबॉक्स की परिवर्तन घटना पर, हम निकटतम माता-पिता की तलाश करते हैं जिसमें कक्षाहै। हमें इस div के अंदर चेक किए गए चेकबॉक्स मिलते हैं। यदि 3 से अधिक (वर्तमान में चेक किए गए एक गिने भी हैं), तो हम वर्तमान को अनचेक करते हैं।

---

आप निश्चित रूप से कक्षाओं में शामिल नहीं करना चाहते हैं, आप के बजाय इस चयनकर्ता का उपयोग कर सकते हैं:

$('[id^="subscriber_"] :checkbox')... 

यह Attribute Starts With Selector कहा जाता है।