programing

JQuery Datatables : 정의되지 않은 'aDataSort' 속성을 읽을 수 없습니다.

javajsp 2023. 8. 17. 20:46

JQuery Datatables : 정의되지 않은 'aDataSort' 속성을 읽을 수 없습니다.

제가 이 바이올린을 만들었으며, 제 요구 사항에 따라 잘 작동합니다.피들

그러나 응용 프로그램에서 동일한 속성을 사용하면 브라우저 콘솔에 정의되지 않은 속성 'aDataSort'를 읽을 수 없습니다.라는 오류가 표시됩니다.

내 애플리케이션에서 자바스크립트는 다음과 같은 것을 읽습니다.컨트롤러 출력을 확인했습니다. 잘 작동하고 콘솔에도 출력됩니다.

$(document).ready(function() {

    $.getJSON("three.htm", function(data) {
             // console.log("loadDataTable >>  "+JSON.stringify(data));
             })
             .fail(function( jqxhr, textStatus, error ) {
             var err = textStatus + ', ' + error;
             alert(err);
             console.log( "Request Failed: " + err);
             })
             .success(function(data){
                 loadDataTable(data);
             });

    function loadDataTable(data){
         $("#recentSubscribers").dataTable().fnDestroy();    
         var oTable = $('#recentSubscribers').dataTable({
             "aaData" : JSON.parse(data.subscribers),
             "processing": true,
            "bPaginate": false,
            "bFilter": false,
            "bSort": false,
            "bInfo": false,
            "aoColumnDefs": [{
            "sTitle": "Subscriber ID",
            "aTargets": [0]
        }, {
            "sTitle": "Install Location",
            "aTargets": [1]
        }, {
            "sTitle": "Subscriber Name",
            "aTargets": [2]
        }, {
            "aTargets": [0], 
            "mRender": function (data, type, full) {
                return '<a style="text-decoration:none;" href="#" class="abc">' + data + '</a>';
            }
        }],
            "aoColumns": [{
            "mData": "code"
        }, {
            "mData": "acctNum"
        }, {
            "mData": "name"
        }]
            });

    }       

})

테이블에 TEAD가 비어 있지 않아야 합니다.dataTable에 따라 예상 데이터의 열 수를 지정해야 합니다. 데이터에 따라 다음과 같이 지정해야 합니다.

<table id="datatable">
    <thead>
        <tr>
            <th>Subscriber ID</th>
            <th>Install Location</th>
            <th>Subscriber Name</th>
            <th>some data</th>
        </tr>
    </thead>
</table>

또한 이 문제가 있었습니다. 이 배열이 범위를 벗어났습니다.

order: [1, 'asc'],

저에게 버그는 데이터 테이블 자체에 있었습니다.DataTables 1.10.9의 정렬 코드는 경계를 확인하지 않으므로 다음과 같은 것을 사용하면

order: [[1, 'asc']]

빈 테이블의 경우 행 idx 1이 없습니다 -> 이 예외는 보장합니다.테이블의 데이터를 비동기식으로 가져오는 동안 이 문제가 발생했습니다.처음에는 데이터를 로드하는 페이지에서 데이터 없이 테이블이 초기화됩니다.결과 데이터를 가져오는 즉시 나중에 업데이트해야 합니다.

내 솔루션:

// add within function _fnStringToCss( s ) in datatables.js
// directly after this line
// srcCol = nestedSort[i][0];

if(srcCol >= aoColumns.length) {
    continue;
}

// this line follows:
// aDataSort = aoColumns[ srcCol ].aDataSort;

저는 같은 문제에 직면했고, 다음과 같은 변화가 저의 문제를 해결했습니다.

$(document).ready(function() {
     $('.datatable').dataTable( {
            bSort: false,
            aoColumns: [ { sWidth: "45%" }, { sWidth: "45%" }, { sWidth: "10%", bSearchable: false, bSortable: false } ],
        "scrollY":        "200px",
        "scrollCollapse": true,
        "info":           true,
        "paging":         true
    } );
} );

aoColumns배열은 각 열의 너비를 설명합니다.sortable특성.

존재하지 않는 열 번호로 주문할 때도 이 오류를 언급하는 다른 내용이 나타납니다.

나의 경우에는.

$(`#my_table`).empty();

그것이 있어야 했던 곳.

$(`#my_table tbody`).empty();

참고: 저의 경우 새 데이터를 삽입하기 전에 필요한 데이터가 있기 때문에 테이블을 비워야 했습니다.

미래에 누군가를 "도와줄" 수 있는 곳을 공유하는 것을 생각했습니다!

저의 경우에는 적용 시 유효한 열 번호를 설정하여 문제를 해결했습니다.order데이터 테이블을 구성하는 스크립트 내의 속성입니다.

var table = $('#mytable').DataTable({
     .
     .
     .
     order: [[ 1, "desc" ]],

단일 따옴표를 전환해야 합니다.[']겹따옴표로["]구문 분석 때문에

테이블에서 데이터 순서 속성을 사용하는 경우 다음과 같이 사용합니다.data-order='[[1, "asc"]]'

대부분의 경우 정의되지 않은 것이 있을 때 발생합니다.코드를 복사하여 인덱스별로 주문에 방해가 되는 열을 몇 개 제거했습니다.신중하게 변경하고 이후의 모든 변수를 변경합니다."order": [1, "discovery"], 이전에 "order": [24, "discovery"]를 사용하여 문제를 해결했지만 해당 인덱스를 사용할 수 없습니다.

이 문제가 발생했습니다. 다른 스크립트가 모든 테이블을 삭제하고 다시 만드는 중이었는데 내 테이블이 다시 만들어지지 않았기 때문입니다.저는 이 문제에 대해 한참을 고민한 끝에 제 표가 페이지에 표시되지 않는다는 것을 알게 되었습니다.데이터 테이블을 초기화하기 전에 테이블을 볼 수 있습니까?

기본적으로 다른 스크립트는 다음 작업을 수행했습니다.

let tables = $("table");
for (let i = 0; i < tables.length; i++) {
  const table = tables[i];
  if ($.fn.DataTable.isDataTable(table)) {
    $(table).DataTable().destroy(remove);
    $(table).empty();
  }
}

그리고 그것은 다음과 같이 했어야 했습니다.

let tables = $("table.some-class-only");
... the rest ...

페이지에 여러 개의 테이블이 있고 다음과 같이 모든 테이블을 한 번에 초기화하려고 시도하여 오류가 발생했습니다.

$('table').DataTable();

많은 시행착오 끝에 따로 초기화를 했더니 오류가 사라졌습니다.

$("#table1-id").DataTable();
$("#table2-id").DataTable();

내 솔루션

추가할 항목:

order: 1 ,

이 형식으로 열을 추가하는 경우

columns: [
    { data: 'name' },
    { data: 'position' },
    { data: 'salary' },
    { data: 'state_date' },
    { data: 'office' },
    { data: 'extn' }
]

그리고 이 형식의 아약스.

 ajax: {
  url: '/api/foo',
  dataSrc: ''
},

나를 위해 해결되었습니다.

오래된 질문입니다. 하지만 제 경우 URL에 관련 없는 주문 =이(가) 가끔 비어 있을 수 있습니다.제가 url 변수를 "sort order" 또는 "order"가 아닌 다른 것으로 변경하자 플러그인이 정상적으로 작동하기 시작했습니다.

같은 오류가 발생했습니다. 제 경우 열 중 하나가 적절한 데이터를 수신하지 못했습니다. 일부 열에는 정수 대신 문자열이 있습니다. 수정한 후 제대로 작동하기 시작했습니다.대부분의 경우 문제는 "적절한 데이터를 수신하지 못하는 테이블"입니다.

에 대한 제 입니다.order: [...]항목 유형을 확인하지 않습니다. 제 경우에는 합격했습니다.[arrOrders]정당한 것과는 반대로arrOrders또는[...arrOrders]으로 결적으로과.[[[ 1, "desc" ], [ 2, "desc" ]]].

언급URL : https://stackoverflow.com/questions/28454203/jquery-datatables-cannot-read-property-adatasort-of-undefined