使用 DataTable 时在选择下拉列表下添加特定的表头名称答案

【问题标题】：Add specific table head name under select dropdown while using the DataTable使用 DataTable 时在选择下拉列表下添加特定的表头名称
【发布时间】：2020-09-06 11:33:15
【问题描述】：

在我的 Laravel 项目中，我使用了数据表，我在其中对特定列进行了过滤。但主要问题是，在我的下拉列表中，我想呈现特定列的头列名称。谁能帮我解决这个问题如何得到这个？

<script>
    $(document).ready(function() {
    $('#exampletable').DataTable( {
        initComplete: function () {
            this.api().columns([3,4,5,7]).every( function () {//THis is used for specific column
                var column = this;
                var select = $('<select><option value="">Specific column Name</option></select>')
                    // .appendTo( $(column.footer()).empty() )
                    .appendTo( '#filltertable' )
                    .on( 'change', function () {
                        var val = $.fn.dataTable.util.escapeRegex(
                            $(this).val()
                        );

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

                column.data().unique().sort().each( function ( d, j ) {
                    var val = $('<div/>').html(d).text();
                    select.append( '<option value="'+val+'">'+val+'</option>' )
                } );
            } );
        }
    } );
} );
</script>

【问题讨论】：

标签： javascript html jquery laravel

【解决方案1】：

现在我已经解决了我真正想要的问题

<script>
    $(document).ready(function() {
    $('#exampletable').DataTable( {
        "ordering": false,
        initComplete: function () {
            this.api().columns([2,3,4,8]).every( function (d) {//THis is used for specific column
                var column = this;
                var theadname = $('#exampletable th').eq([d]).text();
                var select = $('<select class="mx-1"><option value="'+d+'">'+theadname+': All</option></select>')
                    .appendTo( '#filtertable' )
                    .on( 'change', function () {
                        var val = $.fn.dataTable.util.escapeRegex(
                            $(this).val()
                        );

                        column
                            .search( val ? '^'+val+'$' : '', true, false )
                            .draw();
                    } );
                column.data().unique().sort().each( function ( d, j ) {
                    var val = $('<div/>').html(d).text();
                    select.append( '<option value="'+val+'">'+val+'</option>' )
                } );
            } );
        }
    } );
} );
</script>

【讨论】：