Limiter le nombre de pages affichées dans le bootstrap 3 pagination

J'ai plusieurs pages web sur mon site web, qui sont à l'aide de bootstraps (bootstrap 3) la pagination, mais j'ai besoin de savoir comment limiter le nombre de pages affichées dans celui-ci (par exemple, afficher les pages 1 à 10 uniquement).

Si vous sélectionnez la page 2, page 11 b affiche et ainsi de suite.

Comment faites-vous cela?

Je sais qu'il sera probablement JavaScript/jQuery, mais toute aide est appréciée. et si cela peut être fait sans avoir à utiliser de JavaScript/jQuery, alors tout le mieux.

Ci-dessous est une capture d'écran de ma pagination.

Limiter le nombre de pages affichées dans le bootstrap 3 pagination

Comme vous pouvez le voir il y a 12 pages affichées, j'aimerais pages 11 & 12 pour être caché, jusqu'à ce que la page 2 ou la page suivante est sélectionnée, puis les pages 11 serait affiché et les pages que l'on serait caché, ainsi de suite et ainsi de suite.

  • Donc, vous voulez un maximum de 10 pagenumbers affiche?
  • Si vous sélectionnez 2, 1 ne sera pas montré?
  • JNF & A1rPun - Oui, c'est correct
InformationsquelleAutor murday1983 | 2014-08-21
  1. 15

    Il y a un plugin jquery pour fonctionner avec bootstrap, qui permet de résoudre ce problème:
    http://josecebe.github.io/twbs-pagination/
    Avoir un regard sur les "pages visibles option" section.

    Vous pouvez trouver plus d'/d'autres solutions avec google et bootstrap 3 pagination many pages.

    • Merci c'est parfait!
    • Cette solution est parfaite! Merci pour cette astuce.
    • ce lien ne fonctionne plus
    • Mis à jour le lien.
    InformationsquelleAutor claus
  2. 5

    En supposant que votre page est rendu côté serveur (PHP, Ruby, Java, etc) que vous êtes susceptible de vouloir rendre la pagination correctement sur le côté serveur.

    J'ai résolu ce problème n'ya pas si longtemps en PHP, j'avais une fonction qui est appelée pour chaque numéro de la page qui a décidé que ce nombre doit être rendu (ou autre chose).

    Il va quelque chose comme ceci

    if the page number is < 3, render the page number
if the page number is within +-2 of the current page, render the page number
if the page number is > the total number of pages -3 render the page number
if the last page number wasn't rendered and dots haven't already been rendered render dots '...' do indicate a gap

else do nothing

    J'espère que cela vous met sur le bon type de direction

    InformationsquelleAutor Sam
  3. 4

    Cette question a été posée il y a longtemps, mais il est venu alors que je cherchais une réponse.

    Précisant max-size='X' a fonctionné pour moi. Le bootstrap de la pagination de la balise ressemblerait à:

    <pagination class="pagination-sm" total-items="1000" items-per-page="10" max-size="10">
</pagination>

    Espère que cela aide quelqu'un.

    InformationsquelleAutor Vanitha R
  4. 2

    Vous pouvez essayer reviews.maxPages comme indiqué ci-dessous:

    <pagination 
    total-items="reviews.count"
    ng-model="reviews.pageNo"
    max-size="reviews.maxPages"
    boundary-links="true"
    rotate="false"
    num-pages="reviews.noPages"
    ng-change="changePageTo(reviews.pageNo)"></pagination>
    • D'où vient pagination tag viennent?
    InformationsquelleAutor SydMK