반응형
$("#table").DataTable().destroy(); //이전에 만든 것 없애고 다시 그리기 위함.
const table = $("#table").DataTable({
responsive: false, //반응형 설정
pageLength: 10, //페이지 당 글 개수 설정
autoWidth: false,
destroy: true,
processing: true,
serverSide: false,
searching: false, //검색란 표시 설정
ordering: true, //글 순서 설정
paging: true, //페이징 표시 설정
dom: "Blfrtip", //버튼 dom 설정 l을 추가하면 pagelength 드롭다운 표시
buttons: [
{
extend: "excel",
text: "엑셀 다운로드",
filename: function () {
if ($("#file1").val() === "a1") {
return "_"+$("#file1").val();
} else {
return "file2";
}
},
customize: function (xlsx) {
//엑셀 셀 커스텀
var sheet = xlsx.xl.worksheets["sheet1.xml"];
$("c[r=B2] t", sheet).text("custom text1");
$("c[r=C2] t", sheet).text("custom text2");
},
},
],
language: {
emptyTable: "데이터가 없습니다.",
lengthMenu: "페이지당 _MENU_ 개씩 보기",
info: "현재 _START_ - _END_ / _TOTAL_건",
infoEmpty: "데이터 없음",
infoFiltered: "( _MAX_건의 데이터에서 필터링됨 )",
search: "",
zeroRecords: "일치하는 데이터가 없습니다.",
loadingRecords: "로딩중...",
processing: "잠시만 기다려 주세요.",
paginate: {
next: "다음",
previous: "이전",
},
},
data: chartDataList,
columns: [
{ data: "data1" },
{ data: "data2" },
{ data: "data3" },
{ data: "data4" },
],
columnDefs: [
{//0번컬럼 설정
targets: 0,
orderable : false,
render: function (data) {
if ($("#searchType").val() === "day") {
return data + "시";
} else {
return data;
}
},
},
{//1번,2번컬럼 설정
targets: [1,2],
visible: false,
orderable : false,
render: function (data) {
return data;
},
},
{//모든 컬럼 설정
targets: "_all",
render: function (data, type, full, meta) {
console.log(data); // 데이터중 해당 열, 행에 들어갈 data
console.log(type);
console.log(full); // 데이터중 해당 행에 들어갈 full data
console.log(meta); // 해당 셀의 row, col 번호
},
},
],
});
//데이터 테이블 필터링하여 보여주기 설정
//필터링 할 컬럼 번호로 search 이용
table.column(0).search("value").draw();
반응형
'코딩 관련 > Javascript와 jQuery, JSON' 카테고리의 다른 글
[JavaScript] iframe 로딩 완료 이벤트 (0) | 2021.06.04 |
---|---|
[JavaScript] click 이벤트 중복 호출, 누적 되는 문제 (0) | 2021.05.31 |
cannot read property 'substring' of undefined (0) | 2021.05.26 |
[JavaScript] 배열 복사하기. 배열 여러번 이용하기. JSON 복사 (0) | 2021.05.21 |
[JavaScript]for문에서 Ajax 사용 / ajax 반복사용 (0) | 2021.05.18 |