首页 > 解决方案 > 如何在数据表中进行精确查询搜索?

问题描述

我制作了一个按给定过滤器搜索的脚本。一切正常,除了男性/女性搜索,因为女性这个词包含男性这个词。选择男性也会给我女性的结果。

我尝试在 JS 中选择性别之前和之后添加 '\b' 和 '\s' ,都带有单斜杠和双斜杠。下面是代码:

<div id="filters">
    <h2>Filter Tables By</h2>
    Topic:
    <select id="topic_group" onchange="createSearchString();">
        <option></option>
        <option>Cancer</option>
        <option>Smoking</option>
        <option>Vaccinations</option>
        <option>Health Screenings</option>
        <option>Usual Place of Health  Care</option>
    </select>
    Population of interest (Total, Male, Female):
    <select id="popinterest_group" onchange="createSearchString();">
        <option></option>
        <option>Total</option>
        <option>Male</option>
        <option>Female</option>
    </select>
</div>

<script src="/TemplatePackage/3.0/js/libs/jquery-datatables/jquery.dataTables.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#example').dataTable({
            sDom:'<"nhis_search"f>t<"nhis_length"l> <"nhis_pagination"ip>',
            aaSorting: [],
            oLanguage: { sSearch: 'Additional search terms:' },
        });
    });

    var searchString = new String();

    function createSearchString() {
        searchString = $('#topic_group').val() + ' ' + $('#popinterest_group').val() + ' ' + $('#outcomes_group').val();
        $('#example_filter').find('input').val(searchString);
        $('#example_filter').find('input').trigger('keyup');
    }
</script>

标签: javascriptjquerydatatables

解决方案


只需在您的过滤器选项中添加值,然后在onchange时检查所选选项,然后使用数据表过滤器根据过滤器过滤数据

注意:如果您的目的是使用精确值过滤数据,请不要使用search()方法

<div id="filters">
    <h2>Filter Tables By</h2>
    Topic:
    <select id="topic_group" onchange="createSearchString();">
        <option></option>
        <option>Cancer</option>
        <option>Smoking</option>
        <option>Vaccinations</option>
        <option>Health Screenings</option>
        <option>Usual Place of Health  Care</option>
    </select>
    Population of interest (Total, Male, Female):
    <select id="popinterest_group" onchange="createSearchString();">
        <option></option>
        <option>Total</option>
        <option value="0">Male</option>
        <option value="1">Female</option>
    </select>
</div>

<script src="/TemplatePackage/3.0/js/libs/jquery-datatables/jquery.dataTables.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        var table = $('#example').dataTable({
            sDom:'<"nhis_search"f>t<"nhis_length"l> <"nhis_pagination"ip>',
            aaSorting: [],
            oLanguage: { sSearch: 'Additional search terms:' },
        });
    });

    function createSearchString() {
        var gender = $('#popinterest_group').children("option:selected").val(); // get the option value
        var filteredData = table
           .column( 0 ) // index of column
           .data()
           .filter( function ( value, index ) {
               if (gender == 0) return value == "male"
               else if (gender == 1) return value == "female"
               return value
           } );
    }
</script>

推荐阅读