jquery
  • jquery-plugins
  • datatables
  • 2017-09-17 1 views -1 likes 
    -1

    내 데이터 테이블 열 구성 옵션을 데이터를 밀어되지 않습니다DataTable을 제대로

    "columns": [{ 
        "name": "id", 
        "data": "id", 
        "visible": false, 
        "orderable": false 
        }, { 
        "name": "tblOpr", 
        "title": "<div class='table-opr-col table-opr-col-head'><div class='tbl-opr edit-opr-col-head'><span>Edit</span></div></div>", 
        "visible": true, 
        "orderable": false 
        }, { 
        "title": "Employee", 
        "data": "emp_name", 
        "orderable": true, 
        "name": "emp_name" 
        }, { 
        "title": "Date", 
        "data": "date", 
        "orderable": true, 
        "name": "date" 
        }, { 
        "title": "In Time", 
        "data": "in_time", 
        "orderable": true, 
        "name": "in_time" 
        }, { 
        "title": "Out Time", 
        "data": "out_time", 
        "orderable": true, 
        "name": "out_time" 
        }, { 
        "title": "In Deficit", 
        "data": "in_deficit", 
        "orderable": true, 
        "name": "in_deficit" 
        }, { 
        "title": "Out Deficit", 
        "data": "out_deficit", 
        "orderable": true, 
        "name": "out_deficit" 
        }, { 
        "title": "Hours worked", 
        "data": "wt", 
        "orderable": true, 
        "name": "wt" 
        }] 
    

    서버 측이 사실이다. 서버 데이터이다

    { 
        "recordsTotal": 10, 
        "recordsFiltered": 10, 
        "data": [{ 
        "id": "92", 
        "emp_name": "Anish Gupta (10012)", 
        "date": "2017-09-15", 
        "in_time": "22:10:00", 
        "out_time": "00:00:00", 
        "in_deficit": "00:10:00", 
        "out_deficit": "", 
        "wt": "00:00:00" 
        }, { 
        "id": "46", 
        "emp_name": "Raman Kumar (10010)", 
        "date": "2017-09-15", 
        "in_time": "21:39:00", 
        "out_time": "00:00:00", 
        "in_deficit": "-00:21:00", 
        "out_deficit": "", 
        "wt": "00:00:00" 
        }, { 
        "id": "91", 
        "emp_name": "Anish Gupta (10012)", 
        "date": "2017-09-14", 
        "in_time": "22:43:00", 
        "out_time": "07:21:00", 
        "in_deficit": "00:43:00", 
        "out_deficit": "-00:21:00", 
        "wt": "08:38:00" 
        }, { 
        "id": "45", 
        "emp_name": "Raman Kumar (10010)", 
        "date": "2017-09-14", 
        "in_time": "21:10:00", 
        "out_time": "06:49:00", 
        "in_deficit": "-00:50:00", 
        "out_deficit": "00:11:00", 
        "wt": "09:39:00" 
        }, { 
        "id": "90", 
        "emp_name": "Anish Gupta (10012)", 
        "date": "2017-09-13", 
        "in_time": "22:30:00", 
        "out_time": "07:41:00", 
        "in_deficit": "00:30:00", 
        "out_deficit": "-00:41:00", 
        "wt": "09:11:00" 
        }, { 
        "id": "44", 
        "emp_name": "Raman Kumar (10010)", 
        "date": "2017-09-13", 
        "in_time": "22:10:00", 
        "out_time": "06:28:00", 
        "in_deficit": "00:10:00", 
        "out_deficit": "00:32:00", 
        "wt": "08:18:00" 
        }, { 
        "id": "89", 
        "emp_name": "Anish Gupta (10012)", 
        "date": "2017-09-12", 
        "in_time": "00:00:00", 
        "out_time": "00:00:00", 
        "in_deficit": "", 
        "out_deficit": "", 
        "wt": "00:00:00" 
        }, { 
        "id": "43", 
        "emp_name": "Raman Kumar (10010)", 
        "date": "2017-09-12", 
        "in_time": "00:00:00", 
        "out_time": "00:00:00", 
        "in_deficit": "", 
        "out_deficit": "", 
        "wt": "00:00:00" 
        }, { 
        "id": "88", 
        "emp_name": "Anish Gupta (10012)", 
        "date": "2017-09-11", 
        "in_time": "21:10:00", 
        "out_time": "06:28:00", 
        "in_deficit": "-00:50:00", 
        "out_deficit": "00:32:00", 
        "wt": "09:18:00" 
        }, { 
        "id": "42", 
        "emp_name": "Raman Kumar (10010)", 
        "date": "2017-09-11", 
        "in_time": "22:30:00", 
        "out_time": "07:10:00", 
        "in_deficit": "00:30:00", 
        "out_deficit": "-00:10:00", 
        "wt": "08:40:00" 
        }], 
        "draw": 2 
    } 
    

    tblOpr 열의 데이터는 클라이언트 측에서 가압되고, 그래서 열 데이터에 대해 걱정하지 않는다.
    하지만 내 데이터 테이블이 잘못된 인덱스에 데이터를 밀어 넣고 있습니다. 시작에서 3 열을 건너 뜁니다.

    enter image description here

    이 스크린 샷에서 볼 수 있습니다. time에서 열 데이터는 Edit 열, out time 열 데이터는 employee 열이됩니다 ... 같은 방식으로 마지막 열 우리 열 데이터가 나가는 시간 열에 들어가고있다.

    누구든지이 점에 대해 조금이라도 궁금한 점이 있으면 가능한 한 빨리 답장하십시오.

    당신이 DataTables에 데이터를 전달하는 방법이 언급되지

    답변

    0

    ...이 CodePen에서

    , 나는 가정 당신이 할 : json 내가 데이터를 잡아 내 예제에서 사용 된 변수 이름은 "data":json.data을, 게시했습니다.

    그런 다음 문제는 9 열이지만 8 개의 데이터 만 있습니다.
    DataTables에 데이터가없는 추가 열의 처리 방법을 알려줘야합니다.

    "편집"열이라고 가정했습니다.

    "data": null, 
    "defaultContent": "<button>Click!</button>", 
    

    "data": null은 자명하다. 그런 다음 해당 열에 대해 일부 내용을 제공해야합니다. 여기에 버튼을 추가했습니다.

    관련 문제