DataTables dom, Customizing the default menu

DataTables 의 디폴트 값

---

체크박스에 있는 디폴트 기능들의 위치나 순서를 바꾸기.

            dom: "<'row'<'col-sm-12 col-md-6'l><'col-sm-12 col-md-6'f>>" +
                "<'row'<'col-sm-12'tr>>" +
                "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>"

---

dom: "<'row'<'col-sm-12 col-md-6'l><'col-sm-12 col-md-6'f>><'row'<'col-sm-12'tr>><'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>"

---

"<'row'< 여기 >>"안에 들어있는 col- 그룹은 부트스트랩 4 버젼의(레이아웃을 정하는) 클래스 이름임.

중요한건 클래스 이름 끝에 있는 한자리~두자리의 알파벳이다(그 이상도 가능.)

 

알파벳이 정의하는 값은 다음과 같다.

 

•  l : length changing input control (길이입력 컨트롤 변경)
•  f : filtering input (필터링 입력)
•  t : The table (테이블)
•  i : Table information summary (테이블 정보 요약)
•  p : pagination control (페이지 관리)
•  r : processing display element (표시 요소 처리)
•  B : buttons, 버튼 생성

주의 : buttons의  B 대문자는 오타가 아니다.

 

또한 코드를 보면 해당위치마다 "<'row'<>>"를 설정하여 같은 라인에 있을 것인지 따로 있을 것인지 정할 수 있다.

ex) 위의 코드를 보면"<'row'< >>" 안에 있는 l 과 f 는 한 라인에 있다. <div></div>라고 생각하면 편할 듯.

 

위의 소스코드에서 l 과 f 의 위치를 바꾸면 이렇게 된다 ㅇㅋ?

이런식으로 바꾸도록. 이만

---