table.datable.js의 함수가 아닙니다.
<script>
jQuery(document).ready(function () {
$('#sample_3 tfoot th').each(function () {
var title = $('#sample_3 thead th').eq($(this).index()).text();
$(this).html('<input type="text" placeholder="Search ' + title + '" />');
});
// DataTable
var table = $('#sample_3').dataTable();
// Apply the filter
table.columns().eq(0).each(function (colIdx) {
$('input', table.column(colIdx).footer()).on('keyup change', function () {
table
.column(colIdx)
.search(this.value)
.draw();
});
});
});
</script>
테이블을 받았습니다. 열은 함수 js 오류가 아닙니다. 누락된 것은 이해할 수 없습니다.
출처 : https://datatables.net/examples/api/multi_filter.html
변경 시도
var table = $('#sample_3').dataTable();
로.
var table = $('#sample_3').DataTable();
즉, 자본화합니다.DataTable()
출처: https://datatables.net/manual/api#Accessing-the-API
변경:
table.columns()
대상:
table.api().columns()
그것은 나에게 효과가 있었다.
저는 이것을 dataTables의 makeEditable() 함수로 시도하고 있었습니다.DataTables()를 DataTables()로 변경하면 작동하지 않습니다.
h0mayun의 답은 나에게 효과가 있습니다.혹시 다른 사람이 이 문제를 검색하면 h0mayun의 댓글로 작은 것을 추가합니다.
var table = $('#sample_3').dataTable();
$('#sample_3 tfoot th').each(function (i)
{
var title = $('#sample_3 thead th').eq($(this).index()).text();
// or just var title = $('#sample_3 thead th').text();
var serach = '<input type="text" placeholder="Search ' + title + '" />';
$(this).html('');
$(serach).appendTo(this).keyup(function(){table.fnFilter($(this).val(),i)})
});
다음 부품을 제거합니다.
// Apply the filter
table.columns().eq(0).each(function (colIdx) {
$('input', table.column(colIdx).footer()).on('keyup change', function () {
table
.column(colIdx)
.search(this.value)
.draw();
});
});
누군가에게 도움이 되길 바랍니다.
이전의 어떤 답변도 저에게 그 문제를 해결해 주지 못했습니다.
제가 찾은 해결책은table.api().column(colIdx)
대신에table.column(colIdx)
.
이름과 나이가 있는 테이블을 위해 개발한 작업 예제:
table = jQuery('#sel').dataTable( {
"initComplete": function( settings, json ) {
jQuery("#sel_filter").find("input").unbind();
jQuery("#sel_filter").find("label").after(
"<select id='opts'><option value='0'>Name</option>"+
"<option value='1'>Age</option></select>");
jQuery("#sel_filter").find("input").on('keyup change', function(){
table.api().columns( jQuery("#opts").val()).search( this.value ).draw();
});
},
"ajax": {
"url": "urlvalue",
"type": "GET"
},
"columns": [
{ "data": "name" },
{ "data": "age" }
]
});
도움이 되길 바랍니다.
이런 거 해보세요.
var table = $('#sample_3').dataTable();
$('#sample_3 tfoot th').each(function (i)
{
var title = $('#sample_3 thead th').eq($(this).index()).text();
// or just var title = $('#sample_3 thead th').text();
var serach = '<input type="text" placeholder="Search ' + title + '" />';
$(this).html('');
$(serach).appendTo(this).keyup(function(){table.fnFilter($(this).val(),i)})
});
도와주셔서 고마워요.저도 같은 오류 메시지를 받았습니다.하지만 거의 모든 것을 시도한 후에, 제가 발견한 것은 단순히 제 실수가 없었다는 것입니다.
<tfoot> ... </tfoot>
block in my dataTable. Inserting this fixed it and my dataTable could append the search-inputs to this tfoot.
이 질문은 오랜만에 하는 질문이지만 누군가에게 도움이 될 것 같아서 글을 올립니다.
저는 비슷한 문제를 가지고 있었고 검색한 후에 - http://jquery-datatables-column-filter.googlecode.com/svn/trunk/media/js/jquery.dataTables.columnFilter.js 에 있는 파일을 제 코드에 포함시켜야 한다는 것을 깨달았습니다.
저는 이것이 2년 된 게시물이라는 것을 알지만, 이 문제를 검색할 때 구글에서 여전히 상위 검색 결과에 있습니다.그래서 저도 같은 문제가 있었지만 코드를 바꾸지 않고 수정했습니다.내 코드의 문제는 이전 버전의 jQuery 또는 Datatables를 사용했기 때문에(어떤 버전이 문제를 일으켰는지는 확실하지 않음) Datables 사이트에 새 링크를 생성한다는 것입니다.
https://datatables.net/download/index
jQuery2.x를 포함하고 나머지는 기본값으로 유지됩니다.
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.12/datatables.min.js"></script>
따라서 포함된 jQuery 라이브러리와 Datatables 라이브러리는 모두 이 링크에 포함되어 있으므로 제거해야 합니다.그 후에는 모든 것이 오류 없이 잘 작동합니다.
그래서 이전 버전에서 문제가 발생하는 이유를 알아냈습니다.이전 버전의 데이터 테이블에서는 다음 함수를 사용하여 데이터 테이블이 호출되었습니다.
$('#dt1').dataTable();
되었는데, ▁function▁the▁and▁included다▁was▁table▁not▁of니▁version▁given▁old▁which,습▁the▁so그반환 기능이 포함되지 않았습니다.<tablevarname>.columns()
기능: 그서새로기능호출다니합을운래▁so:.$('#dt1').DataTable();
Rizzim이 이미 말한 것처럼 수정해야 하지만 이를 위해서는 데이터 테이블을 업데이트해야 하므로 기능이 포함되어 있습니다.
(영어가 서툴러서 죄송합니다)
언급URL : https://stackoverflow.com/questions/24325786/table-columns-is-not-a-function-in-datatable-js
'source' 카테고리의 다른 글
WHERE 조건에 비해 JOIN 절을 사용하는 이유는 무엇입니까? (0) | 2023.08.08 |
---|---|
입력 유형 날짜로 날짜 설정 (0) | 2023.08.08 |
제품당 최신 두 줄을 구입하고 가격과 날짜를 확인합니다. (0) | 2023.08.08 |
다른 인터페이스로 구성된 인터페이스를 만드는 방법은 무엇입니까? (0) | 2023.08.08 |
헤드리스 브라우저로 테스트를 실행하려면 어떻게 해야 합니까? (0) | 2023.08.08 |