数据表不会过滤

时间:2017-03-23 11:44:20

标签: jquery datatables

我有一个完全不过滤的JQuery,即使我在创建表时有"bFilter" : true,

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="">


<script type="text/javascript">
    $(document).ready(function() {

        var table = $('#manageDevicesTable').DataTable({
            "dom" : '<"top">rt<"bottom"lp><"clear">',
            "autoWidth" : false,
            "paging" : true,
            "bFilter" : true,
            "pageLength" : 20,
            "aaSorting" : [],
            "bSortCellsTop" : true,
            "columnDefs" : [ {
                "targets" : 'nosort',
                "orderable" : false
            }, ]
        });
    });
</script>



<head></head>


<body>


    <table id="manageDevicesTable" class="m-0">
        <thead>
            <tr>
                <th width="19%">Company name</th>
                <th width="15%">Mobile Number</th>
                <th width="20%">Application status</th>
                <th width="10%">App. submission date</th>
                <th width="15%">Criteria</th>
            </tr>

            <tr class="thefilters">

                <td><input name="" size="" maxlength="" id="" value=""
                    type="text" /></td>
                <td><input name="" size="" maxlength="" id="" value=""
                    type="text" /></td>

                <td><select id="statusSelectId"
                    onchange="javascript:newWindowLocationAssignStatus(this.value);">
                        <option value="all">ALL</option>




                        <option value="AWARDED">AWARDED</option>






                        <option value="NO_PENDING_OPERATIONS">&nbsp;&nbsp;No
                            pending operations</option>







                        <option value="IN_PROGRESS_EXTENSION">&nbsp;&nbsp;With an
                            In Progress Extension</option>







                        <option value="WAITING_FOR_WITHDRAW">&nbsp;&nbsp;Waiting
                            for Ecolabel License Withdrawal</option>







                        <option value="MODIFICATION_IN_PROGRESS">&nbsp;&nbsp;With
                            modification in progress</option>







                        <option value="RENEWAL_REQUEST">&nbsp;&nbsp;With a
                            pending renewal request</option>








                        <option value="CANCELLED">CANCELLED</option>






                        <option value="MOBILE_CANCELLED_EXPIRY_CRITERIA">&nbsp;&nbsp;Expiry
                            of License Criteria</option>







                        <option value="MOBILE_CANCELLED_HOLDER_WITHDRAWAL">&nbsp;&nbsp;Award
                            Holder Withdrawal</option>







                        <option value="MOBILE_CANCELLED_NON_PAYMENT_FEES">&nbsp;&nbsp;Non
                            Payment of Fees</option>







                        <option value="MOBILE_CANCELLED_OTHER">&nbsp;&nbsp;Other</option>








                        <option value="IN_PROGRESS">IN PROGRESS</option>







                        <option value="REFUSED">REFUSED</option>




                </select></td>

                <td><input name="" size="" maxlength="" id="" value=""
                    type="text" /></td>
                <td><input name="" size="" maxlength="" id="" value=""
                    type="text" /></td>

            </tr>

        </thead>
        <tbody>

            <tr id="20562"
                onclick="window.location.href = '/digsaw/devices/application/20562'">

                <td>Total Lubrifiants</td>

                <td><font style="text-transform: uppercase;"> ANDROID
                </font></td>


                <td bgcolor="#CDFBD0"><font style="text-transform: uppercase;">
                        <b>AWARDED</b>
                </font> <br> <font style="text-transform: lowercase;"> With an
                        In Progress Extension </font></td>
                <td>27/9/2016</td>

                <td>N/A</td>

            </tr>

            <tr id="1429"
                onclick="window.location.href = '/digsaw/devices/application/1429'">

                <td>NOVAMEX</td>

                <td><font style="text-transform: uppercase;"> IOS
                </font></td>


                <td bgcolor="#CDFBD0"><font style="text-transform: uppercase;">
                        <b>AWARDED</b>
                </font> <br> <font style="text-transform: lowercase;"> With an
                        In Progress Extension </font></td>
                <td>15/10/2014</td>

                <td><font style="text-transform: uppercase;">
                        WINDOWS </font></td>

            </tr>

        </tbody>
    </table>




</body>
</html>

1 个答案:

答案 0 :(得分:2)

您需要在dom选项的值中加入f个字符才能启用搜索栏。例如:

"dom": '<"top">frt<"bottom"lp><"clear">'

标头中的其他过滤器需要额外的编程,请参阅Individual column searching (select inputs)Individual column searching (text inputs)