web-dev-qa-db-ja.com

DataTable検索ラベルの変更

Search:をFilter:に変更しようとしていますが、作成したデータテーブルで。

私が見つけたこれを試しました:

$(document).ready(function() {
oTable = $('#datatable-example_filter').dataTable({
  "aaSorting": [[ 10, "desc" ]],
  "bJQueryUI": true,
  "aLengthMenu": [[25, 50, 100, 250, 500, -1], [25, 50, 100, 250, 500, "All"]],
  "sPaginationType": "full_numbers",
  "oLanguage": {
    "sSearch": "Filter: "
  }
});
} ); 

しかし、動作していません。#datatable-example_filterは、dataTableによって生成されるdiv内のidの名前です

36
efecarranza

「oLanguage」を使用する他の回答は、レガシーDataTables apiを使用することです。 DataTables v 1.10+ documentation によると、構文は次のとおりです。

$('#example').dataTable( {
  "language": {
    "search": "Filter records:"
  }
} );
56
devlin carnate

非常に簡単です。データテーブル関数を呼び出すときにこのパラメーターを指定するだけです。

"oLanguage": {
  "sSearch": "<span>YOUR SEARCH TITLE HERE:</span> _INPUT_" //search
}
16
Marcelo Rocha

DataTableにデータが入力される前に、このコードによって検索ラベルが変更されることがわかりました(私の場合、「Filter results:」に変更されます)。

var dataTable_leSrch = $('#dataTable_leSrch').dataTable({
    "oLanguage": {
        "sSearch": "Filter results:"
    }
});

しかし、後でDataTableにデータを入力すると、ラベルは「Search:」に戻りました。そのため、ラベルを変更したままにするには、このコードをDataTable構成に追加する必要がありました。

function fillDataTable(res) {
if ($('#dataTable_leSrch').length !== 0) {
    $('#dataTable_leSrch').DataTable({
        fixedHeader: {
            header: true,
            headerOffset: $('#header').height()
        },
        oLanguage: {
            "sSearch": "Filter results:"
        },
        responsive: false,
        scrollX: true,
        scrollY: 400,
        scrollCollapse: true,
        select: true,
        destroy: true,
        aaData: res.data.Results,
        ...
3
Paul Gorbas

Datatable Javascriptの内部(table = $dataTable.DataTable)次のコードを追加します。

language: {
  'search' : '' /*Empty to remove the label*/
}

情報をプレースホルダーに入れたいので、検索を空のままにしました

Ps:プレースホルダーを追加する場合は、Datatableの初期化の外に次のコードを追加します

$('.dataTables_filter input').attr("placeholder", "Zoeken...");
3
Andres Paul
// Input text box will be appended at the end automatically
$(document).ready( function() {
  $('#example').dataTable( {
    "oLanguage": {
      "sSearch": "Filter records:"
    }
  } );
} );


// Specify where the filter should appear
$(document).ready( function() {
  $('#example').dataTable( {
    "oLanguage": {
      "sSearch": "Apply filter _INPUT_ to table"
    }
  } );
} );

詳細については、このリンクを確認してください http://legacy.datatables.net/usage/i18n

0
Mourad MAMASSI