Joey
Joey

Reputation: 1866

Bootstrap-Table filterBy Not Working

I am trying to do some filtering (using bootstrap-table by wenzhixin) on a table I have being populated via JSON.

Part of 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>

Part of 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]
    });
}

The table populates correctly with all the data but once I hit the button I see that filterBy() is called but all that happens is it looks like the page refreshes but all the data in the table is still there like no filtering ever occurred.

I've tried changing make: [model] to make: ["Honda"] just as a test and it still doesn't work. It still performs the same behavior of refreshing the page with all the data still in tact.

Not sure what I am doing incorrectly.

Upvotes: 3

Views: 2413

Answers (1)

Devran
Devran

Reputation: 29

https://github.com/wenzhixin/bootstrap-table/commit/de867d379a46b377efa7eef83fdf898b9073b28c

This is an issue i think after feature version: 1.11.0. Check the bootstrap-table.js and find this. I hope its will solve your problem. Good Luck!

Upvotes: 2

Related Questions