Question

我正在尝试使用javascript对我的数据表进行过滤，但现在我需要用'n'个单词过滤一列

enter image description here

但是当我使用过滤器时，它只能像一个单词一样理解，但不是

 $(document).ready(function () {

        var table = $('#example').DataTable({

            initComplete: function () {
                count = 0;
                this.api().columns().every(function () {
                    var title = this.header();
                    //replace spaces with dashes
                    title = $(title).html().replace(/[\W]/g, '-');
                    var column = this;
                    var select = $('<select id="' + title + '" class="select2" ></select>')
                        .appendTo($(column.footer()).empty())
                        .on('change', function () {
                            //Get the "text" property from each selected data
                            //regex escape the value and store in array
                            var data = $.map($(this).select2('data'), function (value, key) {
                                return value.text ? '^' + $.fn.dataTable.util.escapeRegex(value.text) + '$' : null;
                            });

                            //if no data selected use ""
                            if (data.length === 0) {
                                data = [""];
                            }

                            //join array into string with regex or (|)
                            var val = data.join('|');

                            //search for the option(s) selected
                            column
                                .search(val ? val : '', true, false)
                                .draw();
                        });
                    //unique, tipo group by 
                    //sorte deixa em ordem abcd
                    column.data().unique().sort().each(function (d, j) {
                        select.append('<option value="' + d + '">' + d + '</option>');
                    });

                    //use column title as selector and placeholder
                    $('#' + title).select2({
                        multiple: true,
                        closeOnSelect: false,
                        placeholder: "Select a " + title
                    });

                    //initially clear select otherwise first option is selected
                    $('.select2').val(null).trigger('change');
                });
            }
        });
    });

<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

    <link href="https://nightly.datatables.net/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>
    <!-- Select2 plugin -->
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css">
    <!-- Select2 plugin -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>

    <meta charset=utf-8 />
    <title>DataTables - JS Bin</title>
</head>
<body>
    <div class="container-fluid" style="margin-left:0px !important">
        <table id="example" class="display nowrap" width="100%">
            <thead>
                <tr>
                    <th>Demanda</th>
                    <th>Título</th>
                    <th>Solicitante</th>
                    <th>Data Inclusao</th>
                    <th>Área</th>
                    <th>SP</th>

                </tr>
            </thead>

            <tfoot>
              <tr>
                <th>Demanda</th>
                    <th>Título</th>
                    <th>Solicitante</th>
                    <th>Data Inclusao</th>
                    <th>Área</th>
                    <th>SP</th>

              </tfoot>
                
<tbody>
        <tr>
            <td>Shad Decker</td>
            <td>Regional Director</td>
            <td>Edinburgh, Mykonos</td>
            <td>51</td>
            <td>2008/11/13</td>
            <td>$5,300</td>
        </tr>
        <tr>
            <td>Michael Bruce</td>
            <td>Javascript Developer</td>
            <td>Edinburgh, Londres, Paris</td>
            <td>29</td>
            <td>2011/06/27</td>
            <td>$4,080</td>
        </tr>
        <tr>
            <td>Donna Snider</td>
            <td>System Architect</td>
            <td>New York, Sao Paulo, Tokyo</td>
            <td>27</td>
            <td>2011/01/25</td>
            <td>$3,120</td>
        </tr>
            </tbody>
        </table>
    </div>
</body>
</html>

我试图在列中分隔女巫单词，但这不起作用

数据表过滤器，其中列中包含“ n”个单词

0 个答案: