показать все записи в таблице datatables при нажатии кнопки

любые идеи, подсказки, как показать все записи, когда я нажимаю кнопку с идентификатором «show_all_records»? и если я нажму кнопку, у которой есть идентификатор «restore_records», таблица datatables будет восстановлена в своем состоянии по умолчанию, например. записи возвращаются к состоянию по умолчанию.показать все записи в таблице datatables при нажатии кнопки

Я могу использовать «пейджинг: ложь/истина», но я не знаю, как применить его в живом режиме.

$(document).ready(function(){ 
 

 
    $('#sample_table').DataTable({ 
 
     "bSort": false, 
 
     "pagingType": "full_numbers", 
 
     "dom": 'T<"clear">lfrtip', 
 
    }); 
 
    
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://cdn.datatables.net/r/dt/dt-1.10.8/datatables.min.css" rel="stylesheet"/> 
 
<script src="https://cdn.datatables.net/r/dt/dt-1.10.8/datatables.min.js"></script> 
 

 

 

 
<table cellpadding="0" cellspacing="0" id="sample_table"> 
 
    <thead> 
 
    <tr> 
 
     <th>Name</th> 
 
     <th>Position</th> 
 
     <th>Branch</th> 
 
     <th>Department</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Sample Name 1</td><td>Sample position</td><td>sample branch</td><td>sample department</td> 
 
    </tr> 
 
</tbody> 
 
</table> 
 

 
<button id="show_all_records">show all records</button> 
 
<button id="restore_records">Restore records on its default state</button>

источник

2015-08-27 Juliver Galleto

dataTables предоставляют различные функции для достижения этой цели. Итак, вот как вы можете это сделать. Проверьте, встроенные комментарии для получения дополнительной информации:

DEMO

var oTable; //global variable to hold reference to dataTables 
var oSettings; //global variable to hold reference to dataTables settings 

$(document).ready(function(){ 
    oTable=$('#sample_table').DataTable({ 
     "bSort": false, 
     "pagingType": "full_numbers", 
     "dom": 'T<"clear">lfrtip', 
    }); //store reference of your table in oTable 
    oSettings = oTable.settings(); //store its settings in oSettings 
}); 

$("#show_all_records").on('click',function(){ 
    oSettings[0]._iDisplayLength = oSettings[0].fnRecordsTotal(); 
    //set display length of dataTables settings to the total records available 
    oTable.draw(); //draw the table 
}); 

$("#restore_records").on('click',function(){ 
    oSettings[0]._iDisplayLength=10; 
    //set it back to 10 
    oTable.draw();//again draw the table 
});

источник

2015-08-27 06:07:11

гениально! в любом случае я получил эту ошибку «Невозможно преобразовать неопределенный или нулевой объект», хотя его работа –

Ошибка консоли? Где ошибка указывает? –

jQuery-2.1.3.min.js: 3 Uncaught TypeError: Невозможно преобразовать undefined или null в объект –

вы можете использовать "lengthMenu", чтобы дать возможность в show entitiesdrop down, чтобы показать все записи. вам не нужны кнопки show all records и Restore records on its default state (в данном случае).

$('#sample_table').DataTable({ 
 
    "bSort": false, 
 
     "pagingType": "full_numbers", 
 
     "dom": 'T<"clear">lfrtip', 
 
     "lengthMenu": [[10, 25, 50, -1],[10, 25, 50, "All"] 
 
    ] 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://cdn.datatables.net/r/dt/dt-1.10.8/datatables.min.css" rel="stylesheet"/> 
 
<script src="https://cdn.datatables.net/r/dt/dt-1.10.8/datatables.min.js"></script> 
 

 
<table cellpadding="0" cellspacing="0" id="sample_table"> 
 
    <thead> 
 
     <tr> 
 
      <th>Name</th> 
 
      <th>Position</th> 
 
      <th>Branch</th> 
 
      <th>Department</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr> 
 
      <td>Sample Name 1</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 2</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 3</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 4</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 5</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 6</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 7</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 8</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 9</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 10</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 11</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 12</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 13</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 14</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 15</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 16</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 17</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 18</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 19</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 20</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 21</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 22</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 23</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 24</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 25</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 26</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 27</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 28</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 29</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 30</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 31</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 32</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 33</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 34</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 35</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 36</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 37</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 38</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 39</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Sample Name 40</td> 
 
      <td>Sample position</td> 
 
      <td>sample branch</td> 
 
      <td>sample department</td> 
 
     </tr> 
 
    </tbody> 
 
</table>

источник

2015-08-27 06:27:51 ozil

показать все записи в таблице datatables при нажатии кнопки

ответ

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