2017-01-06 6 views
0

Ich versuche, eine Filterung (mit bootstrap-table by wenzhixin) auf einer Tabelle, die ich über JSON bevölkert.Bootstrap-Tabelle filterBy funktioniert nicht

Teil von HTML:

<button class="btn btn-primary" id="filterBtn">Filter</button> 

<div class="container"> 
    <table class="table table-bordered table-hover" id="table"> 
     <thead> 
     <tr> 
      <th data-field="make">Make</th> 
      <th data-field="model">Model</th> 
      <th data-field="year">Year</th> 
     </tr> 
     </thead> 
    </table> 
</div> 

Teil von JS:

// JSON file is input from a successful AJAX call. 
function populateTable(json) { 
    $('#table').bootstrapTable({ 
     data: json 
    }) 
} 

// a button is click in html which calls this function. 
function filterBy(model) { 
    console.log("filterBy is called"); 
    $('#table').bootstrapTable('filterBy', { 
     make: [model] 
    }); 
} 

Die Tabelle die Daten korrekt mit allen auffüllt, aber sobald ich den Knopf drücken Ich sehe, dass filterBy() genannt wird Aber alles, was passiert, ist, dass die Seite aktualisiert wird, aber alle Daten in der Tabelle sind immer noch da, als ob keine Filterung jemals stattgefunden hätte.

Ich habe versucht, make: [model] zu make: ["Honda"] nur als Test zu ändern und es funktioniert immer noch nicht. Es führt immer noch das gleiche Verhalten beim Aktualisieren der Seite mit allen noch intakten Daten.

Nicht sicher, was ich falsch mache.

+0

könnten Sie eine Datentabelle verwenden [https://datatables.net/], die viele nützliche Methoden bietet (filter() ist einer von ihnen). Es wird die Dinge für Sie einfacher machen – catchiecop

Antwort

Verwandte Themen