DataTables.net dataTable.columns(0).search('term').draw() 不填充列[0][搜索][值]



2天以来,我一直在为一个看似非常简单的问题而绞尽脑汁,而且有很多可用的帮助,但我无法让它工作。我试图在网格的每一列上做一个服务器端搜索,当我调用dataTable.columns(0).search('search-term').draw()的POST请求时,它生成的columns[0][search][value]总是空的。

下面是我一遍又一遍地尝试不同事物的两种方法,但这两种方法都不适合我,显然我缺少了一些东西。

为了清晰起见,我还附上了一个快照,下面是我的数据表的完整配置,有人能指出我做错了什么吗?

方法# 1

initComplete: function () {
        $('.scheduling-search')
            .on('keyup change', function () {
                var i = $(this).attr('data-column');
                var v = $(this).val();
                schedulingGrid.columns(i).search(v).draw();
            }
        );
    }

方法# 2

schedulingGrid.columns().every( function () {
    var column = this;
    $( 'input', this.footer() ).on( 'keyup change', function () {
        column
            .search( this.value )
            .draw();
    } );
});

下面是我的DataTable

的完整配置
var schedulingGrid = $('#scheduling-manager-grid').DataTable({
    processing: true,
    searchDelay: 1000,
    pageLength: {$pageSize},
    paginate: true,
    lengthChange: false,
    filter: false,
    info: true,
    autoWidth: false,
    serverSide: true,
    order: [[3, '{$defaultSortOrder}']],
    language: {
        paginate: {
            next: '',
            previous: ''
        }
    },
    ajax: {
        type: 'post',
        url: '{$url}',
    },
    columns: [
        {
            width: '40px',
            data: 'briefingId',
            name: 'id',
            searchable: true,
            orderable: true
        },
        {
            width: '100px',
            data: 'briefingTitle',
            name: 't.title',
            searchable: true,
            orderable: true
        },
        {
            width: '100px',
            data: 'dateSubmitted',
            name: 't.created_at',
            searchable: true,
            orderable: true
        },
        {
            width: '100px',
            data: 'preferredDate',
            name: 't.preferred_date',
            searchable: true,
            orderable: true
        },
        {
            width: '100px',
            data: 'requesterName',
            name: 't.requestor_name',
            searchable: true,
            orderable: true
        },
        {
            width: '100px',
            data: 'briefingStatus',
            name: 't.briefing_status_id',
            searchable: true,
            orderable: true
        },
        {
            width: '100px',
            data: 'briefingType',
            name: 't.briefing_type_id',
            searchable: true,
            orderable: true
        },
        {
            data: 'notes',
            name: 'notes',
            searchable: true,
            orderable: false
        }
    ],
    initComplete: function () {
        $('.scheduling-search')
            .on('keyup change', function () {
                var i = $(this).attr('data-column');
                var v = $(this).val();
                schedulingGrid.columns(i).search(v).draw();
            }
        );
    }
});

HTML像

<table id="scheduling-manager-grid">
  <thead>
    <tr>
      <th>Briefing ID</th>
      <th>Briefing Title</th>
      <th>Date Submitted</th>
      <th>Preferred Briefing Date</th>
      <th>Requestor Name</th>
      <th>Briefing Status</th>
      <th>Briefing Type</th>
      <th>Notes</th>
    </tr>
  </thead>
  <thead>
    <tr>
      <td><input style="width: 50px;" type="text" data-column="0" class="scheduling-search"></td>
      <td><input style="width: 80px;" type="text" data-column="1" class="scheduling-search"></td>
      <td><input style="width: 80px;" type="text" data-column="2" class="scheduling-search"></td>
      <td><input style="width: 80px;" type="text" data-column="3" class="scheduling-search"></td>
      <td><input style="width: 80px;" type="text" data-column="4" class="scheduling-search"></td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
  </thead>
</table>

SOLUTION

我配置了错误的数据表。来自datatable。net的Allan指出了这个问题并修复了它。我不得不从配置中删除filter: false以使其工作。

查看完整的讨论在这里:https://datatables.net/forums/discussion/comment/98607#Comment_98607

最新更新