Search code examples
javascriptjquerycssbootstrap-table

how to empty search box on click event in wenzhixin bootstrap table without refresh page?


I want to empty search box. when I click anywhere on a page then without refresh page I want to get an only empty search box in a wenzhixin bootstrap table

 <table id="view_table" data-toggle="table" 
      data-search="true"
      data-page-list="[5, 10, 20]"
      data-page-size="5"
      data-pagination="true"
      data-show-pagination-switch="true" >
 <thead>
    <tr class="table-heading">
       <th data-field="image"><h4>Image</h4></th>
       <th data-field="name"><h4>Name</h4></th>
    </tr>
 </thead>

   <tbody>


   </tbody>
</table>
<button id="empty_search" class="btn btn-primary">Save</button>
 <script>
    $('#empty_search').on('click', function(){
        $.(this.["data-search"]).empty();
    });
</script>

Solution

  • When you click on the clear button so search box value reset and you search again new fresh data.

    $('#clear').on("click",function() {
         $('#bootstrap_table_ID').bootstrapTable("resetSearch","");
     });