부트 스트랩 테이블 페이지 매기기가 화면 밖으로 나옴

테이블에 n 개의 행이 있으며 테이블에 페이지 매김을 사용하면 호출기가 매우 커집니다. 페이지 매김을 제한 할 수있는 방법이 있습니까? 예를 들어, 페이지 매김은 1,2,3을 포함해야하고 다음을 클릭하면 1,2,3을 4,5,6 등으로 대체해야합니다. 페이지 매김이 화면 밖으로 나오지 않도록하십시오. 내 코드로 많은 변경을 시도했지만 작동하지 않습니다. 아무도 나를 도울 수 없습니까?부트 스트랩 테이블 페이지 매기기가 화면 밖으로 나옴

출처

2016-11-04 Owner

크기를 조정하려면 큰 블록의 경우 .pagination-lg, 작은 블록의 경우 .pagination-sm을 추가하십시오. –

감사합니다. 하지만 테이블 크기가 500 행 이상일 수 있으므로 크기를 조정하더라도 페이지 매김은 매우 길다. – Owner

가능한 [부트 스트랩을 사용한 표 페이지 매김이 작동하지 않습니다.] (http://stackoverflow.com/questions/40416972/table-pagination-using-bootstrap-is-not-working) – vanburen

매우 유용한 jQuery 플러그인을 발견했습니다. 다음은 link입니다. 이 코드로 설정하는 일이 있으면

<html> 
<head> 
    <script src="//code.jquery.com/jquery-2.1.3.min.js"></script> 
    <script src="//netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
    <script src="//raw.github.com/botmonster/jquery-bootpag/master/lib/jquery.bootpag.min.js"></script> 
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
</head> 
<body> 
    <div id="content">Dynamic Content goes here</div> 
    <div id="page-selection">Pagination goes here</div> 
    <script> 
     // init bootpag 
     $('#page-selection').bootpag({ 
      total: 10 
     }).on("page", function(event, /* page number here */ num){ 
      $("#content").html("Insert content"); // some ajax content loading... 
     }); 
    </script> 
</body> 
</html>

을 그런 다음이를 사용할 수 있습니다

$('.demo3').bootpag({ 
    total: 500, 
    page: 3, 
    maxVisible: 3, 
    href: "#pro-page-{{number}}", 
    leaps: false, 
    next: 'next', 
    prev: null 
}).on('page', function(event, num){ 
    $(".content3").html("Page " + num); // or some ajax content loading... 
});

이 도움이 있으면 알려주세요.

출처

2016-11-04 09:28:36 user1573470

부트 스트랩 테이블 페이지 매기기가 화면 밖으로 나옴

답변

관련 문제