शीर्षलेख में और पंक्ति में चेकबॉक्स के साथ Jquery डेटाटेबल:

Question

पर काम नहीं कर रहे सभी चेकबॉक्स का चयन करें मैं Jquery Datatable का उपयोग कर रहा हूं। मैं एक चेकबॉक्स के साथ शीर्षलेख और पंक्तियों के साथ पहला स्तंभ रखना चाहता हूं और शेष पंक्ति के चेकबॉक्स के साथ हेडर चेकबॉक्स के चयन को टॉगल करना चाहिए। मैं कार्यान्वयन के नीचे है।

DataTable विशेषता

"aoColumns": [{ "sTitle": "<input type='checkbox' id='selectall' onclick='toggleChecks(this);' ></input>", "mDataProp": null, "sWidth": "20px", "sDefaultContent": "<input type='checkbox' ></input>", "bSortable": false },null,null,null,null,null,null] 

DataTable पंक्ति

<td><input type="checkbox' class="case"></input></td> 

जावास्क्रिप्ट समारोह

function toggleChecks(obj) 
    { 
     $('.case').prop('checked', obj.checked); 
    } 

यह ठीक काम किया है जब मैं एक पृष्ठ पर कर रहा हूँ। लेकिन जब मैं पेजिंग करता हूं तो चेकबॉक्स अन्य पेज के लिए अनचेक रहते हैं। सभी चेकबॉक्स के लिए लगातार व्यवहार करने के लिए इसे कैसे प्राप्त करें। कृपया सहायता करें।

Answer 1

पृष्ठ बदलते समय आपको तालिका को अद्यतन करने के लिए फ़ंक्शन FnDrawCallback का उपयोग करना चाहिए।

आप इस फ़ंक्शन में हेडर चेकबॉक्स का मान चेक कर सकते हैं और नई पंक्तियों को चेकबॉक्स अपडेट कर सकते हैं।

आप मॉडल में अपनी ऑब्जेक्ट्स में बूलियन वैल्यू भी जोड़ सकते हैं, और जब आप चेक या अनचेक करते हैं तो उस मान को बदल सकते हैं। यदि आप मॉडल तक पहुंचते हैं तो आप अपने सभी तत्वों के मानों को संशोधित नहीं कर सकते हैं, न केवल प्रस्तुत किए गए। फिर, जब आप अपनी कोशिकाओं को लोड करते हैं तो आप चेकबॉक्स के साथ उस सत्य/गलत का प्रतिनिधित्व करते हैं। यह सबसे संगत दृष्टिकोण है, लेकिन मॉडल और दृश्य के बीच एक अच्छा सिंक्रो प्राप्त करने के लिए शायद अधिक काम शामिल होगा।

Answer 2

दोस्तों,

एक ऐसी ही समस्या यह है कि त्वरित समाधान की जरूरत थी।

इस समस्या के लिए एक समाधान के बने, मदद कर सकता है किसी को:

मैं गतिशील तालिका कुछ डेटा को खिलाने के रूप में:

oTable1.fnAddData 
([ 
    "<span id='" + any_obj.id + "' style='display:block; width: 10px;'><input class='checkbox' type='checkbox' /></span>", 
    title, 
    modified, 
    version 
]); 

सूचना चेकबॉक्स के लिए अवधि। यह स्पष्ट रूप से छुपा रहता है और आसानी से पहुंचा जा सकता है।

Answer 3

मैं कुछ की तरह किया है,

$('#selectall').change(function() { 
         var isSelected = $(this).is(':checked'); 
         if(isSelected){ 
          $('.case').prop('checked', true); 
         }else{ 
          $('.case').prop('checked', false); 
         } 
        }); 

दस्तावेज़ तैयार पर

।