programing

JQuery DataTable에서 기본적으로 모든 행을 표시하는 방법

telebox 2023. 8. 20. 10:44
반응형

JQuery DataTable에서 기본적으로 모든 행을 표시하는 방법

jQuery datatable에서 기본적으로 모든 행을 표시하는 방법을 아는 사람이 있습니까?

저는 이 코드를 시도해 보았지만, 기본적으로 10개의 행만 표시됩니다.

   $("#adminProducts").dataTable({
        "aLengthMenu": [100]
    });

사용:

$('#example').dataTable({
    aLengthMenu: [
        [25, 50, 100, 200, -1],
        [25, 50, 100, 200, "All"]
    ],
    iDisplayLength: -1
});

또는 1.10+를 사용하는 경우

$('#example').dataTable({
    paging: false
});

사용해야 하는 옵션은 iDisplayLength입니다.

$('#adminProducts').dataTable({
  'iDisplayLength': 100
});
$('#table').DataTable({
   "lengthMenu": [ [5, 10, 25, 50, -1], [5, 10, 25, 50, "All"] ]
});

기본적으로 모든 항목이 로드됩니다.

$('#example').dataTable({
    aLengthMenu: [
        [25, 50, 100, 200, -1],
        [25, 50, 100, 200, "All"]
    ],
    iDisplayLength: -1
});

또는 1.10+를 사용하는 경우

$('#example').dataTable({
    paging: false
});

기본적으로 25를 로드하려면 모두 이 작업을 수행하지 마십시오.

$('#example').dataTable({
    aLengthMenu: [
        [25, 50, 100, 200, -1],
        [25, 50, 100, 200, "All"]
    ],
});

이것은 나에게 효과가 있습니다.

    $(document).ready(function() {
    $('#example').DataTable( {
        "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]]
      } );
    } );

DataTables 1.10+를 사용하는 경우 데이터* 속성을 사용할 수 있습니다.<table>꼬리표를 달다data-page-length="-1"

이는 아래와 같은 데이터 테이블 기본 구성에 "-1"이 정의되어 있다고 가정합니다.

$.extend(true, $.fn.dataTable.defaults, { 
    lengthMenu: [[10, 25, 50, 250, -1], [10, 25, 50, 250, "All"]]
});

당신의 자바스크립트는 단순해집니다.$("table").DataTables();HTML 내의 모든 테이블에 대한 디스플레이를 사용자 정의할 수 있습니다. 즉, 동일한 페이지에 10개 행으로 제한되어야 하는 두 번째, 더 작은 테이블이 있는 경우,<table data-page-length="10">

.html 파일의 전체 기능 자바스크립트입니다.

<!--- javascript -->
<script type="text/javascript">
  $(document).ready(function(){
    $('#sortable').dataTable({
        'iDisplayLength': 100
    })})
</script>

'fnDrawCallback' 사용

  $('#dataTable').dataTable({
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "fnInitComplete": function(){
            $('.display_results').show();
        },
        "fnDrawCallback": function() {
            $('.def').click(function(){
                var msg = $(this).next().text();
                $('.messages').messageBox()//Custom Dialog
            });
        }
})

당신은 bootstrap-table.min.js를 다운로드하고 수정해야 합니다.

  • bootstrap-table.min.js를 다운로드한 후 열기만 하면 "pageList:[10]"를 찾으려면 "pageList:[10,15,20,25,50,100","All""로 설정하여 "All"이 다음과 같이 작성되도록 합니다.

  • 기본 페이지 크기는 동일한 "pageSize:10" 행에서도 변경할 수 있습니다. 페이지 크기:"All"로 변경할 수 있습니다.

  • 다른 옵션도 수정할 수 있습니다.

  • 수정을 완료한 후 이를 포함하거나 새 장소에 연결하는 것을 잊지 마십시오.

나는 그것이 충분히 분명하고 쉽게 이루어지길 바랍니다.

언급URL : https://stackoverflow.com/questions/9443773/how-to-show-all-rows-by-default-in-jquery-datatable

반응형