数据表搜索选项

时间:2013-10-16 04:52:32

标签: jquery datatables

我正在使用数据表用于表。我想仅根据名称列进行搜索,但默认情况下它会根据所有列进行搜索。我想根据名称进行搜索,只有任何帮助都应该被理解。enter image description here < / p>

JS-代码

$('#table-filter').dataTable({
"bDestroy": true,
"bPaginate": true,
"bProcessing": false,
 "bStateSave": false,
 "aLengthMenu": [[5, 10, 20, 50, 100 , -1], [5, 10, 20, 50, 100, "All"]],
 "iDisplayLength" : 5,
 "sPaginationType": "full_numbers",

 "aoColumnDefs": [
  { 'bSortable': false, 'aTargets': [ 0,1,7,8 ] }
        ],
"oLanguage": {
                 "sUrl": baseUrl+"/media/language/dt/"+lang_code+".txt",
             }
  })

4 个答案:

答案 0 :(得分:3)

试试这个,我希望这会对你有所帮助:

$('#example').dataTable( {
    "aoColumnDefs": [
      { "bSearchable": true, "aTargets": [ 0 ] },
      { "bSearchable": false, "aTargets": [ 1] },
      { "bSearchable": false, "aTargets": [ 2] },
      { "bSearchable": false, "aTargets": [ 3] }
    ] } );

<强> Example

$('#example').dataTable( {
    "aoColumnDefs": [
      { "bSearchable": false, "aTargets": [ 1,2,3,4 ] }      

    ] } );

<强> Example

这是 API Documentation for columns

答案 1 :(得分:1)

根据Datatables document

// Using aoColumnDefs
$(document).ready( function() {
  $('#example').dataTable( {
    "aoColumnDefs": [
      { "bSearchable": false, "aTargets": [ 0 ] }
    ] } );
} );


// Using aoColumns
$(document).ready( function() {
  $('#example').dataTable( {
    "aoColumns": [
      { "bSearchable": false },
      null,
      null,
      null,
      null
    ] } );
} );

答案 2 :(得分:0)

另一种解决方案可能是使用Yet Another DataTables Column Filter - (yadcf)(我写的)

您可以使用自动填充过滤器类型,然后将其放置在页面中的任何位置,代码示例:

$('#table-filter').dataTable({...}).yadcf(
    [
        {
          column_number : 2, 
          filter_type: "auto_complete",
          filter_container_id: "external_filter_container"
        }
    ]);

其中external_filter_container是您要放置过滤条件的div / span的ID

答案 3 :(得分:0)

您也可以创建自己的输入搜索。

1.-输入搜索html:

<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6 dataTables_filter">
				<div class="dataTables_filter">
					<label style="float:right;">
						<fmt:message key="provider.search.name"/>
						<input id="colNameSearch_filter" type="text" class="form-control input-sm">
					</label>
				</div>
			</div>

在输入html中写入抛出一个函数。

$('#colNameSearch_filter').on( 'keyup click', function () {
        filterColumn(1);
    } );

这就是我们称之为的功能。

function filterColumn ( i ) {
    $('#tableResponse').DataTable().column( i ).search(
        $('#colNameSearch_filter').val()
    ).draw();
}