DataTables: 정의되지 않은 속성 '길이'를 읽을 수 없습니다.

DataTables: 정의되지 않은 속성 '길이'를 읽을 수 없습니다.

저는 이것이 일반적인 이슈라는 것을 알고 있으며, 여기 Stack Overflow 및 기타 사이트(데이터 테이블 웹 사이트 포함)에서 유사한 질문을 모두 읽었습니다.

명확히 하기 위해, 저는

• PHP 코드 시그니터
• 마테리아제크스

또, JSON 어레이가 올바르게 수신되고 있는 것도 확인했습니다.

[{"name_en":"hello","phone":"55555555"},{"name_en":"hi","phone":"00000000"}]

HTML 테이블은 다음과 같습니다.

<table id="customer_table">
     <thead>
         <tr>
            <th>Name</th>
            <th>Phone</th>
         </tr>
     </thead>
</table>

그리고 여기 내 것이 있다.document.ready기능:

  $(document).ready(function(){
            //$('#customer_table').DataTable();
            $('#customer_table').DataTable( {
                "ajax": 'json',
                "dataSrc": "",
                 "columns": [
                    { "data": "email" },
                    { "data": "name_en" }
                ]
            });
  });

에러가 발생하고 있는 것은

Uncaughed TypeError: 정의되지 않은 속성 'length'를 읽을 수 없습니다.

더욱 심플합니다.사용하기만 하면 됩니다.dataSrc:''dataTable이 객체 대신 배열을 예상하도록 하기 위해 axdefinition의 옵션:

    $('#pos-table2').DataTable({
                  processing: true,
                  serverSide: true,
                  ajax:{url:"pos.json",dataSrc:""}
            }
    );

Ajax 옵션 참조

원인

이 에러TypeError: Cannot read property 'length' of undefined보통 jQuery DataTables는 Ajax 요청에 대한 응답에서 데이터를 찾을 수 없음을 의미합니다.

기본적으로 jQuery DataTables는 데이터가 다음 형식 중 하나일 것으로 예상합니다.데이터가 기본값 이외의 형식으로 반환되기 때문에 오류가 발생합니다.

어레이 배열

{ 
   "data": [
      [
         "Tiger Nixon",
         "System Architect",
         "$320,800",
         "2011/04/25",
         "Edinburgh",
         "5421"
      ]
   ]
}

오브젝트 배열

{ 
   "data": [
      {
         "name": "Tiger Nixon",
         "position": "System Architect",
         "salary": "$320,800",
         "start_date": "2011/04/25",
         "office": "Edinburgh",
         "extn": "5421"
      }
   ]
}

솔루션

기본 형식을 사용하거나 옵션을 사용하여 Ajax 응답에서 테이블 데이터를 포함하는 데이터 속성을 정의합니다().data디폴트).

자세한 내용은 데이터 배열 위치를 참조하십시오.

링크

jQuery DataTables를 참조하십시오. 자세한 내용은 일반적인 JavaScript 콘솔 오류입니다.

네, 도와주셔서 감사합니다.

하지만 그 문제는 그것보다 훨씬 쉬웠다.

JSON을 수정하여 어레이를 다음과 같이 데이터라는 속성에 할당하기만 하면 됩니다.

{
  "data": [{
    "name_en": "hello",
    "phone": "55555555",
    "email": "a.shouman",
    "facebook": "https:\/\/www.facebook.com"
  }, ...]
}

다음과 같이 시도합니다. 반환은 d.data가 아니라 d여야 합니다.

 ajax: {
      "url": "xx/xxx/xxx",
      "type": "GET",
      "error": function (e) {
      },
      "dataSrc": function (d) {
         return d
      }
      },

Ajax를 함수로 사용하는 경우 파라미터가 설정된 상태에서 JSON 데이터가 반환됩니다.

$('#example').dataTable({
    "ajax" : function (data, callback, settings) {
        callback({
            data: [...],
            recordsTotal: 40,
            recordsFiltered: 40}
            ));
    }
})

JSON 데이터가 있는 경우 다음 오류가 나타납니다.

보다 나은 해결책은 다음 명령어를 할당하는 것입니다.var data로컬 json 어레이 개체에 대한 자세한 내용은 https://datatables.net/manual/tech-notes/4를 참조하십시오.

표의 내용을 표시하는 데 도움이 됩니다.

 $(document).ready(function(){   

        $('#customer_table').DataTable( {
         "aaData": data,

           "aoColumns": [{
                            "mDataProp": "name_en"
                        }, {
                            "mDataProp": "phone"
                        }, {
                            "mDataProp": "email"
                        }, {
                            "mDataProp": "facebook"
                        }]
            });
        });

내 경우, datables ajax의 예시와 같이 aaData라는 속성에 json을 할당해야 했습니다.

뷰 속성 이름과 데이터 테이블의 열 섹션 내 이름이 일치하지 않을 때 발생할 수 있습니다. 속성 이름과 열 데이터 이름이 일치하는지 확인하십시오.

위의 답변은 상황을 잘 설명하지만 문제 슈팅 시 브라우저가 DataTables가 기대하는 포맷을 얻을 수 있는지 확인합니다.다른 이유가 있을 수도 있어data예를 들어 사용자가 데이터 URL에 액세스할 수 없고 대신 HTML을 얻을 수 있는 경우.또는 리모트 시스템에 몇 가지 불행한 '수정'이 있습니다.브라우저의 [디버깅]툴의 [네트워크]탭이 도움이 됩니다.

파티에는 너무 늦었지만, 위의 해결책 중 어느 것도 나에게 효과가 없었다.불필요하다'는 않았어요.Found total xxx records 덧붙였습니다.info:false설정을 변경해 주세요.내가 그걸 없앴을 때 모든 게 작동했어

첫 페이지는 정상적으로 로드되었습니다.다음 키를 눌렀을 때 두 번째 페이지가 로드되었지만 바로 위의 콘솔 오류가 발생했습니다.

내 HTML 코드에서 테이블에는 두 개의 태그가 열려 있었다.제가 이걸 고쳤는데 완벽하게 작동했어요.그 테이블에는 에이잭스를 사용하지 않았어요

검증할 값이 적은 테이블 구조를 확인하십시오.

Ajax에서는 사용할 수 없는 이메일 필드를 렌더링할 때 필드를 체크 아웃할 수 있습니다.

$.ajax({
  url: "url",
  type: 'GET',
  success: function(data) {
    var new_data = {
      "data": data
    };
    console.log(new_data);
  }
});

언급URL : https://stackoverflow.com/questions/34287402/datatables-cannot-read-property-length-of-undefined