bootstrap-table-filter-control扩展名在bootstrap-table中不起作用 [英] bootstrap-table-filter-control extension doesn't work in bootstrap-table

问题描述

我使用引导表，并希望使用此示例中，您可以看到如何使用此扩展名.当我想将此扩展用于更多列时，它不起作用.在我的示例中，过滤器仅适用于一列.

I use bootstrap-table and would like to use table-filter-control extension. In this example you can see how to use this extension. When I want to use this extension for more columns, it doesn't work. In my example filter works only for one column.

jsfiddle

html

<table ref="mainTable" class="table table-striped table-bordered table-hover" 
       cellSpacing="0" id="mainTable" data-show-toggle="true" 
       data-show-columns="true" data-search="true" data-pagination="true" data-filter-control="true">
    <thead>
        <tr>
            <th data-field="state" data-checkbox="true"></th>
            <th data-field="Customer Name" data-sortable="true" data-filter-control="select">Customer Name</th>
            <th data-field="Location Type" data-sortable="true">Location Type</th>
            <th data-field="Location" data-sortable="true" data-filter-control="select">Location</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td></td>
            <td>Cap Corp</td>
            <td>Main</td>
            <td>Norwalk CT 06851</td>
        </tr>
        <tr>
            <td></td>
            <td>Cap Corp</td>
            <td>Other</td>
            <td>Norwalk CT 06851</td>
        </tr>
        <tr>
            <td></td>
            <td>Tel</td>
            <td>Main</td>
            <td>Slough SL1 4DX</td>
        </tr>
        <tr>
            <td></td>
            <td>Tel</td>
            <td>Other</td>
            <td>London W1B 5HQ</td>
        </tr>
    </tbody>
</table>

推荐答案

数据字段不应包含空格，请尝试更改

data-filed should have not spaces, try to change

data-field="Customer Name"

到

data-field="CustomerName"

我更新了您的jsfiddle和filter-control作品.

I updated your jsfiddle and filter-control works.

http://jsfiddle.net/5h595r6g/9/

但是，如我在这篇文章中所述，最好将过滤器选项更新为可用值:

However it would be great to implement filter options updating to available values, as I described in this post:

引导表过滤器控制-如何从选择选项中取消不必要的值

这篇关于bootstrap-table-filter-control扩展名在bootstrap-table中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！