如何禁用数据表上特定列的搜索/过滤器? [英] How to disable a search/filter on a specific column on a datatable?

查看:146
本文介绍了如何禁用数据表上特定列的搜索/过滤器?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的datatable有5列,我需要禁用第3,第4和最后一列的过滤。



请帮助!!!



这是javascript:

 < script type =text / javascriptlanguage =javascriptclass =init> 
$(document).ready(function(){

//设置 - 向每个页脚单元格添加文本输入
$('#example tfoot th')每个(function(){
var title = $('#example thead th')。eq($(this).index()).text();
$(this) < input type =textplaceholder =Search'+ title +'/>');
});

// DataTable
var table = $( '#example')DataTable();

//应用搜索
table.columns()。eq(0).each(function(colIdx){
$ ('input',table.column(colIdx).footer()).on('keyup change',function(){
table
.column(colIdx)
.search .value的)
.draw();
});
});
});
< / script>


解决方案

您可以使用 .not 排除您要添加输入文本的列。此外,还可以添加代码以避免增加的事件处理程序的任何输入框在排除的列(虽然如果在这些细胞中不存在输入框也没关系):

  $(文件)。就绪(函数(){
//设置 - 文本输入添加到每个页脚细胞
$( '#示例TFOOT日' )。不( :当量(2),:当量(3),:当量(4))//排除列3,4,和5
。每个(函数(){
变种标题= $('#example thead th')。eq($(this).index()).text();
$(this).html('< input type =textplaceholder = Search+ title +'/>');
});

// DataTable
var table = $('#example')。

//应用搜索
table.columns()。eq(0).each(function(colIdx){
if(colIdx == 2 || colIdx == 3 || colIdx == 4)return; //不要为这些列添加事件处理程序

$('input',table.column(colIdx).footer()).on( KEYUP变化,函数(){

.COLUMN(colIdx)
.search(THIS.VALUE)
.draw();
});
});
});

请参阅小提琴: http://jsfiddle.net/30phqqqg/1/


My datatable has 5 columns and I need to disable filtering for the 3rd, 4th and last column.

please help!!!

this is the javascript:

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

            // Setup - add a text input to each footer cell
            $('#example tfoot th').each( function () {
                var title = $('#example thead th').eq( $(this).index() ).text();
                $(this).html( '<input type="text" placeholder="Search '+title+'" />' );
            } );

            // DataTable
            var table = $('#example').DataTable();

            // Apply the search
            table.columns().eq( 0 ).each( function ( colIdx ) {
                $( 'input', table.column( colIdx ).footer() ).on( 'keyup change', function () {
                    table
                        .column( colIdx )
                        .search( this.value )
                        .draw();
                } );
            } );
        } );
</script>

解决方案

You can use .not to exclude the columns you want to add input text too. Furthermore, you can also add code to avoid adding event handlers to any input boxes in the excluded columns (although if no input boxes exist in those cells it doesn't matter):

$(document).ready(function() {
    // Setup - add a text input to each footer cell
    $('#example tfoot th').not(":eq(2),:eq(3),:eq(4)") //Exclude columns 3, 4, and 5
                          .each( function () {
        var title = $('#example thead th').eq( $(this).index() ).text();
        $(this).html( '<input type="text" placeholder="Search '+title+'" />' );
    } );

    // DataTable
    var table = $('#example').DataTable();

    // Apply the search
    table.columns().eq( 0 ).each( function ( colIdx ) {
        if (colIdx == 2 || colIdx == 3 || colIdx == 4) return; //Do not add event handlers for these columns

        $( 'input', table.column( colIdx ).footer() ).on( 'keyup change', function () {
            table
                .column( colIdx )
                .search( this.value )
                .draw();
        } );
    } );
} );

See Fiddle: http://jsfiddle.net/30phqqqg/1/

这篇关于如何禁用数据表上特定列的搜索/过滤器?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆