2013-01-02 9 views
13

मैं डेटाटेबल्स का उपयोग कर रहा हूं और मेरे पास तालिका उत्पन्न करने के लिए निम्न कोड है। मैं पढ़ने, लिखने, निष्पादित करने और व्यवस्थापक मानों के लिए चेकबॉक्स प्रदर्शित करना चाहता हूं। यदि मान 1 के बराबर है, तो मैं चेकबॉक्स को चेक करना चाहता हूं। और यदि 0 चेकबॉक्स अनचेक किए गए हैं।jquery.datatables में चेकबॉक्स कैसे दिखाएं?

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

<script type="text/javascript" charset="utf-8"> 
      $(document).ready(function() { 
       var oTable = $('#example').dataTable({ 
        "sScrollY": "500px",         
        "bPaginate": false, 
        "bProcessing": true, 
        "sAjaxSource": "sources/sample.json" 
       }); 


      }); 
     </script> 

एचटीएमएल

<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"> 
        <thead> 
         <tr> 
          <th width="20%">Browser</th> 
          <th width="25%">Read</th> 
          <th width="25%">Write</th> 
          <th width="15%">Execute</th> 
          <th width="15%">Admin</th> 
         </tr> 
        </thead> 
        <tbody> 

        </tbody> 
        </table> 

JSON

{ "aaData": [ 
    ["Trident","0","0","0","1"], 
    ["Trident","0","1","0","0"], 
    ["Trident","0","0","1","1"], 
    ["Trident","0","0","1","1"], 
    ["Trident","0","0","1","1"], 
    ["Trident","0","0","0","0"], 
    ["Gecko","1","1","1","1"], 
    ["Gecko","0","0","0","1"], 
    ["Other browsers","1","0","0","U"] 
] } 
+0

ऐसा लगता है कि आप डेटाटेबल में इनलाइन नियंत्रण जोड़ना चाहते हैं: [डेटाटेबल इनलाइन नियंत्रण] (http://editor.datatables.net/release/DataTables/extras/Editor/examples/inlineControls.html)। भी [संबंधित ] (http://stackoverflow.com/questions/3444339/jquery-datatables-plugin-adding-a-checkbox- गतिशील रूप से) – zer0bit

उत्तर

22

मैं इसे

$(document).ready(function() { 
    var oTable = $('#example').dataTable({ 
     "aoColumnDefs": [{ 
      "aTargets": [0], 
      //"mData": "download_link", 
      "mRender": function (data, type, full) { 
       if (data == "Gecko") { 
        return '<a href="' + data + '">' + data + ' Download Gecko</a>'; 
       } else { 
        return '<a href="' + data + '">' + data + ' Download</a>'; 
       } 
      } 
     }, { 
      "aTargets": [1], 
      //"mData": "download_link", 
      "mRender": function (data, type, full) { 
       if (data == "1") { 
        return '<input type=\"checkbox\" checked value="' + data + '">'; 
       } else { 
        return '<input type=\"checkbox\" value="' + data + '">'; 
       } 
      } 
     }, { 
      "aTargets": [2], 
      //"mData": "download_link", 
      "mRender": function (data, type, full) { 
       if (data == "1") { 
        return '<input type=\"checkbox\" checked value="' + data + '">'; 
       } else { 
        return '<input type=\"checkbox\" value="' + data + '">'; 
       } 
      } 
     }, { 
      "aTargets": [3], 
      //"mData": "download_link", 
      "mRender": function (data, type, full) { 
       if (data == "1") { 
        return '<input type=\"checkbox\" checked value="' + data + '">'; 
       } else { 
        return '<input type=\"checkbox\" value="' + data + '">'; 
       } 
      } 
     }, { 
      "aTargets": [4], 
      //"mData": "download_link", 
      "mRender": function (data, type, full) { 
       if (data == "1") { 
        return '<input type=\"checkbox\" checked value="' + data + '">'; 
       } else { 
        return '<input type=\"checkbox\" value="' + data + '">'; 
       } 
      } 
     }], 
     "bFilter": false, 
     "sScrollY": "500px", 
     "bPaginate": false, 
     "bProcessing": true, 
     "sAjaxSource": "sources/sample.json" 
    }); 
}); 
mrenderer datables का उपयोग कर काम करने के लिए प्राप्त करने में सक्षम था
+2

मैं इस समाधान के लिए धन्यवाद, जेसन से चेकबॉक्स को प्रदर्शित करने के तरीके पर एक उदाहरण ढूंढ रहा था, मैं चेकबॉक्स अपडेट के बाद डेटा को सर्वर पर वापस सहेजने के लिए सहेजें बटन कैसे बनाना है, यह जानना चाहूंगा। धन्यवाद। –

संबंधित मुद्दे