Question

我在这个表中使用数据表我需要下拉过滤器这个我在Jquery代码下面使用但是我的值不会附加在我的下拉列表中，它应该只出现在下拉列表中而不是显示在下拉列表中。

  <!DOCTYPE html>
    <html lang="en">
      <head>
            <link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
                    <link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.2.0/css/responsive.dataTables.min.css">
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
                    <script type="text/javascript" src="https://cdn.datatables.net/responsive/2.2.0/js/dataTables.responsive.min.js"></script> 
      </head>
      <body>
               <table id="example" class="display" cellspacing="0" width="100%">
                                                    <thead>
                                                        <tr id="filters">
                                                            <th>Name</th>
                                                            <th>abc</th>
                                                            <th>zdfd</th>
                                                            <th>Followers</th>
                                                            <th>Rating</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr>
                                                            <td>Tiger Nixon</td>
                                                            <td>XYz</td>
                                                            <td>csdf</td>
                                                            <td>2000</td>
                                                            <td>61</td>
                                                        </tr>
                                                        <tr>
                                                            <td>Garrett Winters</td>
                                                            <td>abc</td>
                                                            <td>fdf</td>
                                                            <td>1000</td>
                                                            <td>63</td>
                                                        </tr>
                                                        <tr>
                                                            <td>Ashton Cox</td>
                                                            <td>fd</td>
                                                            <td>sdfds</td>
                                                            <td>700</td>
                                                            <td>90</td>
                                                        </tr>
                                                        <tr>
                                                            <td>Cedric Kelly</td>
                                                            <td>fdds</td>
                                                            <td>fdf</td>
                                                            <td>500</td>
                                                            <td>200</td>
                                                        </tr>
                                                        <tr>
                                                            <td>Airi Satou</td>
                                                            <td>fdsf</td>
                                                            <td>fdsf</td>
                                                            <td>600</td>
                                                            <td>50</td>
                                                        </tr>

                                                    </tbody>
                                                </table>
      </body>
    </html>

below is Jquery code I am using:


$(document).ready(function(){ 
      $('#example').DataTable({
                            responsive: true,
                            ordering: false,
                            initComplete: function () {
                                this.api().columns().every(function () {
                                    var column = this;

                                    var select = $('<select><option value=""></option></select>')
                                        .appendTo($("#filters").find("th").eq(column.index()))
                                        .on('change', function () {
                                        var val = $.fn.dataTable.util.escapeRegex(
                                        $(this).val());                                     

                                        column.search(val ? '^' + val + '$' : '', true, false)
                                            .draw();
                                    });

                                    console.log(select);

                                    column.data().unique().sort().each(function (d, j) {
                                        select.append('<option value="' + d + '">' + d + '</option>')
                                    });
                                });
                            }
                        });

                        console.log()
});

为了更好地理解下面是我拍摄的屏幕截图..

我需要将值/文字附加到我的下拉列表中。

您的早期回复表示赞赏..

谢谢..

数据表th值应附加在下拉列表中

0 个答案: