如何在jquery.datatables中显示复选框？

我正在使用数据表，我有以下代码来生成表。我想显示读取，写入，执行和管理值的复选框。如果该值等于1，我希望复选框被选中。如果0复选框未选中。如何在jquery.datatables中显示复选框？

的Javascript

<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>

HTML

<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"] 
] }

来源

2013-01-02 user244394

它认为你正在寻找将内联控件添加到数据表：[datatable inline controls]（http://editor.datatables.net/release/DataTables/extras/Editor/examples/inlineControls.html）.also [related ]（http://stackoverflow.com/questions/3444339/jquery-datatables-plugin-adding-a-checkbox-dynamically） – zer0bit

我能够得到它使用datables mrenderer

$(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" 
    }); 
});

工作

来源

2013-01-03 00:08:32 user244394

我正在寻找一个关于如何从json显示复选框的例子，感谢这个解决方案，我想知道如何在复选框更新后创建保存按钮以将数据保存回服务器。谢谢。 –

如何在jquery.datatables中显示复选框？

回答

相关问题