datatable-serverside search(カラムフィルタ)の問題.
5689 ワード
サーバ側で既存のsearch inputを検索する際にinputパラメータ値を受け入れdjangoでフィルタリングした.
今度は欄ごとにフィルタリングします.
FixedHeaderではcolumnフィルタリングが必要です.
When displaying tables with a particularly large amount of data shown on each page,
it can be useful to have the table's header and/or footer
fixed to the top or bottom of the scrolling window.
This lets your users quickly determine what each column refers to rather than needing to scroll back to the top of the table.
方法。
Individual column filtering
STEP 1
まず、search inputをテーブルに入れます. $('#example tfoot th').each( function () {
var title = $('#example thead th').eq( $(this).index() ).text();
$(this).html( '<input type="text" placeholder="Search '+title+'" />' );
} );
STEP 2
バインディング
$('#example tfoot th').each( function () {
var title = $('#example thead th').eq( $(this).index() ).text();
$(this).html( '<input type="text" placeholder="Search '+title+'" />' );
} );$( '#example tfoot input' ).on( 'keyup change clear', function () {
//우선 이벤트까진 정상 발생한다.
//debugger
if ( test_table.search() !== this.value && this.value.length>0) {
search_result = test_table.search( this.value );
search_result.draw();
}
} );げんしょう
->同じ検索機能を適用しますが、サーバ側では使用できません.クライアントは正常に動作しています.
https://datatables.net/extensions/colreorder/examples/initialisation/col_filter.html
http://live.datatables.net/tobekuxu/1/edit
Reference
この問題について(datatable-serverside search(カラムフィルタ)の問題.), 我々は、より多くの情報をここで見つけました https://velog.io/@sandartchip/datatable-serverside-searchcolumn-filtering-문제テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol