2014-02-05 3 views
0

Я реализовал один пример таблицы данных. Когда я нажимаю на «все» флажок в заголовке таблицы данных, его проверка и снятие флажка происходит только один раз. Второй раз он не смог проверить все флажки в теле таблицы. Мой код выглядит следующим образом:Как я могу проверить все флажки в datatable, когда я нажимаю «Все» в заголовке таблицы?

JSFIDDLE link click here

<html> 
<head> 
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
    <script type="text/javascript" src="http://cdn.datatables.net/1.10.0-beta.1/js/jquery.dataTables.js"></script> 
    <link href="http://cdn.datatables.net/1.10.0-beta.1/css/jquery.dataTables.css" rel="stylesheet"> 
</head> 

<body> 
    <h1>DataTable Checkbox</h1> 
    <table class="display dataTable" id="flow-table"> 
     <thead> 
      <th class="check"> 
       <input type="checkbox" id="flowcheckall" value="">&nbsp;All</input> 
      </th> 
      <th>Name</th> 
      <!-- <th>Cookie</th> --> 
      <th>Priority</th> 
     </thead> 
     <tbody> 
     </tbody> 
    </table> 
</body> 
<script> 
    $(document).ready(function() { 
     var str = ""; 
     for (i = 0; i < 25; i++) { 
      a = i + 1; 
      str += "<tr><td><input type='checkbox' id='checkall' name='mydata' value=" + a + "></td><td>a" + a + "</td><td>name" + a + "</td></tr>"; 
     } 
     $("#flow-table > tbody").append(str); 
     oTableStaticFlow = $('#flow-table').dataTable({ 
      "aoColumnDefs": [{ 
         'bSortable': false, 
         'aTargets': [0] 
         }], 
     }); 

     $("#flowcheckall").click(function() { 
      if (this.checked) { 
       //alert("checked"); 
       //$('input', oTable.fnGetNodes()).attr('checked',this.checked); 
       $('#flow-table tbody input[type="checkbox"]').attr('checked', true); 
      } else { 
       //alert("unchecked"); 
       $('#flow-table tbody input[type="checkbox"]').attr('checked', false); 
      } 
     }); 
    }); 
</script> 

</html> 

Кто-нибудь мне помочь ..!

ответ

3

Вы можете просто проверить/снять все флажки с помощью этой функции:

$("#flowcheckall").click(function() { 
     $('#flow-table tbody input[type="checkbox"]').prop('checked', this.checked); 
    }); 

fiddle

+0

его работа .. Спасибо –

1

Удалить этот Js называют

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 

Я проверил его и он работал отлично после удаления этого. Причина должна быть в том, что другие 2, которые вы назвали, - это версия 1.10.0-beta.1 и должны были вступить в противоречие с jquery-1.10.1 .min.js, на который вы звонили.

Смежные вопросы