source

table.datable.js의 함수가 아닙니다.

manysource 2023. 8. 8. 21:42

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