다른 명령
새 문서: === jQuery DataTable 기본으로 표시되는 항목(행) 수 뱐걍 === * pageLength 옵션을 사용하여 변경 * 테이블이 처음 로드될 때 몇 개의 행을 보여줄지 설정 ==== 기본 갯수 변경 예시 ==== <source lang=html> $(document).ready(function() { $('#example').DataTable({ "pageLength": 10 // 기본 표시 갯수를 10으로 설정 }); }); </source> * pageLength: 한 페이지에 표시할 기본 항목 수를 지정 ** 기본값... |
편집 요약 없음 |
||
(같은 사용자의 중간 판 4개는 보이지 않습니다) | |||
1번째 줄: | 1번째 줄: | ||
=== jQuery DataTable 기본으로 표시되는 항목(행) 수 | === jQuery DataTable 기본으로 표시되는 항목(행) 수 변경 === | ||
* pageLength 옵션을 사용하여 변경 | * pageLength 옵션을 사용하여 변경 | ||
* 테이블이 처음 로드될 때 몇 개의 행을 보여줄지 설정 | * 테이블이 처음 로드될 때 몇 개의 행을 보여줄지 설정 | ||
==== 기본 갯수 변경 예시 ==== | ==== 기본 갯수 변경 예시 ==== | ||
<source lang= | <source lang=js> | ||
$(document).ready(function() { | $(document).ready(function() { | ||
$('#example').DataTable({ | $('#example').DataTable({ | ||
16번째 줄: | 16번째 줄: | ||
==== 더 많은 옵션과 함께 설정하는 예시 ==== | ==== 더 많은 옵션과 함께 설정하는 예시 ==== | ||
<source lang= | <source lang=js> | ||
$(document).ready(function() { | $(document).ready(function() { | ||
$('#example').DataTable({ | $('#example').DataTable({ | ||
31번째 줄: | 31번째 줄: | ||
==== 실시간으로 기본 갯수 변경 ==== | ==== 실시간으로 기본 갯수 변경 ==== | ||
* 만약 테이블이 이미 초기화된 후에 기본 표시 항목 수를 변경 | * 만약 테이블이 이미 초기화된 후에 기본 표시 항목 수를 변경 | ||
<source lang= | <source lang=js> | ||
var table = $('#example').DataTable(); | var table = $('#example').DataTable(); | ||
table.page.len(50).draw(); // 표시할 기본 항목 수를 50으로 변경 | table.page.len(50).draw(); // 표시할 기본 항목 수를 50으로 변경 | ||
</source> | </source> | ||
[[category:datatable]] | |||
[[category:javascript]] | |||
[[category:web]] |
2025년 6월 24일 (화) 08:47 기준 최신판
jQuery DataTable 기본으로 표시되는 항목(행) 수 변경
- pageLength 옵션을 사용하여 변경
- 테이블이 처음 로드될 때 몇 개의 행을 보여줄지 설정
기본 갯수 변경 예시
$(document).ready(function() { $('#example').DataTable({ "pageLength": 10 // 기본 표시 갯수를 10으로 설정 }); });
- pageLength: 한 페이지에 표시할 기본 항목 수를 지정
- 기본값은 10이지만, 원하는 숫자로 변경 가능 25, 50 등을 설정.
더 많은 옵션과 함께 설정하는 예시
$(document).ready(function() { $('#example').DataTable({ "pageLength": 25, // 기본 표시 갯수를 25로 설정 "lengthMenu": [ [10, 25, 50, 100], [10, 25, 50, 100] ] // 선택할 수 있는 항목 갯수 메뉴 }); });
- lengthMenu: 사용자가 페이지당 표시할 행 수를 선택할 수 있는 드롭다운 메뉴를 제공.
- 첫 번째 배열은 설정할 수 있는 숫자
- 두 번째 배열은 해당 숫자의 레이블
실시간으로 기본 갯수 변경
- 만약 테이블이 이미 초기화된 후에 기본 표시 항목 수를 변경
var table = $('#example').DataTable(); table.page.len(50).draw(); // 표시할 기본 항목 수를 50으로 변경