Web Standard

DataTables 의 language 옵션을 이용하면 쉽게 한글화 할 수 있습니다. 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051 // DataTables Default var lang_eng = { "decimal" : "", "emptyTable" : "No data available in table", "info" : "Showing _START_ to _END_ of _TOTAL_ entries", "infoEmpty" : "Showing 0 to 0 of 0 entries", "infoFiltered" : "(filtered from _MAX_ total entries)",..

DataTables 를 이용해서 테이블을 만든 후 복사하기/엑셀로 저장하기/PDF로 저장하기/프린트 하기 버튼을 달아보자. buttons: [ 'copy', 'excel', 'pdf', 'print' ] 부분을 옵션으로 주면 간단하게 적용할 수 있다. 만약 오류가 발생되거나 아무 버튼도 노출되지 않는다면 필요한 js파일을 모두 정상적으로 불러 왔는지 체크해볼것. 결과물 (좌측 상단의 버튼들) 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586 TEST var data..

운영툴을 만드는데 테이블이 필요해서 datatable 을 사용했다. datatable의 장점은 프론트나 서버사이드 개발자가 소팅, 페이징, 검색등을 전혀 신경쓰지 않아도 된다는 점이다. JSON으로 응답받는 정보들은 그냥 전체 리스트를 내려주기만 하면 된다. 그러면 datatable이 알아서 테이블을 그려주고, 일단 테이블이 완성된 이후에는 검색이나 소팅이 굉장히 빠르게 동작한다. (특정 액션을 할때마다 API를 재호출 하는게 아니기 때문)디자인 또한 제공되는 css를 사용해서 별도 스타일을 적용하지 않아도 꽤 괜찮은 모습으로 표현된다. (우리는 semantic ui를 사용했다.)테이블 복사, Excel 다운로드등도 코드 몇줄만 추가해주면 쉽고 편리하게 구현할 수 있다. 단점은 튜닝이 어렵다는 점. 버튼..