2016-11-15 3 views
0

У меня есть datatables of serverside.i, я не знаю, как сбросить входной столбец после поиска. И я хочу, чтобы исходные данные возврата возвращались к основному, как перед поиском. так вот мой код:Сброс данных для фильтрации нескольких столбцов

//my script: 
 
var table = $('#dataTables'); 
 

 
// begin first table 
 
    table.dataTable({ 
 

 
    "ajax": { 
 
      "url": "<?php echo site_url('leader') ?>", 
 
      "type": "POST", 
 
      "data": function(d) { 
 
      d.full_name = $('#full_name').val(); 
 
      d.start_date = $('#start_date').val(); //whats right code? 
 
      d.end_date = $('#end_date').val(); //whats right code? 
 
         
 
      }, 
 
      }, 
 
     ..... 
 
     ..... 
 
     $('#btn-search').click(function(){ 
 
      var data_tables =   $('#dataTables').DataTable(); 
 
      data_tables 
 
       .search(this.value) 
 
       .draw(); 
 
     }) 
 
    
 
    $('#btn-reset').click(function(){ 
 
      var data_tables = $('#dataTables').DataTable(); 
 
      data_tables 
 
       .reset(this.value('')) 
 
       .draw(); 
 
     })
<!-- my view: --> 
 
<div class="form-inline"> 
 
<div class="form-group"> 
 
<input type="text" name="full_name" class="form-control" id="full_name" placeholder="Name"/> 
 
</div> 
 
        
 
<div class="form-group"> 
 
<div class="input-group date date-picker" data-date-format="dd-mm-yyyy"> 
 
    <input type="text" name="start_date" class="form-control" readonly id="start_date" size="8"> 
 
    <span class="input-group-btn"> 
 
    <button class="btn default" type="button"> 
 
     <i class="fa fa-calendar"></i> 
 
    </button> 
 
    </span> 
 
</div> 
 
</div> 
 
<div class="form-group"> 
 
<div class="input-group date date-picker" data-date-format="dd-mm-yyyy"> 
 
<input type="text" name="end_date" class="form-control" readonly id="end_date" size="8"> 
 
<span class="input-group-btn"> 
 
<button class="btn default" type="button"> 
 
    <i class="fa fa-calendar"></i> 
 
</button> 
 
</span> 
 
</div> 
 
</div> 
 
    <button class="btn btn-primary black" id="btn-reset">clear</button> 
 
<button class="btn btn-warning" id="btn-search">Search</button> 
 
</div>

стороне сервера:

$where = ""; 
 
if (!empty($full_name)) 
 
{ 
 
    $where .= "And full_name = '$full_name' "; 
 
} 
 
if(!empty($start_date)) 
 
{ 
 
    $where .= "And start_date >= to_date('$start_date','DD-MM-YYYY') "; 
 
} 
 

 
if(!empty($end_date)) 
 
{ 
 
    $where = "And end_date <= to_date('$end_date','DD-MM-YYYY') "; 
 
}

как создать кнопку сброса после поиска Multicolumn в DataTables?

ответ

0

Вы попробовали this, чтобы сбросить столбец, и таблица будет сброшена обратно до поиска.

var table = $('#example').DataTable(); 
table.search('') 
    .columns().search('') 
    .draw(); 
+0

я попробовал, но ничего не случилось – ione

+0

от моего понимания в вашем вопросе, поле поиска не из поля поиска по умолчанию от DataTables верно? – saf21

+0

Да, я создаю руководство – ione

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