Comment rendre ma pagination responsive

Résolu/Fermé

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 - Modifié le 8 déc. 2021 à 07:56
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 - 13 déc. 2021 à 13:24

Bonjour a tous

encore une nuit blanche a chercher après une chose spéciale et ou je suis resté sans réponse
les paginations automatique que j'ai trouvé sont superbe

car les onglets de paginations se crée au fur et a mesure des éléments a paginer

si on a pas beaucoup d articles on a que quelques onglets

mais dans mon cas je dois paginer + de 160 articles
donc cela me fait par incrément de 10
16 onglets

ce que je souhaiterais c'est de savoir comment réaliser
ceci
1/2/3.....45/46/47

voici ce qui se passe pour l instant en responsive

comment résoudre le soucis si possible sans javascript

j'ai bien trouver cette documentation mais comment la mettre en place

https://bootstrap-vue.org/docs/components/pagination-nav

voici mon code

     <div class="container" style=" max-width: 100%;margin:auto;">
                    <nav>
                    <ul class="pagination">
                        <!-- Lien vers la page précédente (désactivé si on se trouve sur la 1ère page) -->
                        <li class="page-item <?= ($currentPage == 1) ? "disabled" : "" ?>">
                            <a href="?page=<?= $currentPage - 1 ?>" class="page-link">Précédente</a>
                        </li>
                        <?php for($page = 1; $page <= $pages; $page++): ?>
                          <!-- Lien vers chacune des pages (activé si on se trouve sur la page correspondante) -->
                          <li class="page-item <?= ($currentPage == $page) ? "active" : "" ?>">
                                <a href="?page=<?= $page ?>" class="page-link"><?= $page ?></a>
                            </li>
                        <?php endfor ?>
                          <!-- Lien vers la page suivante (désactivé si on se trouve sur la dernière page) -->
                          <li class="page-item <?= ($currentPage == $pages) ? "disabled" : "" ?>">
                            <a href="?page=<?= $currentPage + 1 ?>" class="page-link">Suivante</a>
                        </li>
                    </ul>
                </nav>
            
        </div>

A voir également:

Comment rendre ma pagination responsive
Pagination powerpoint - Guide
Sommaire avec pagination - Guide
Pagination excel plusieurs feuilles ✓ - Forum Excel
Indesign pagination à partir de la 2ème page - Forum InDesign
Pagination word - Guide

9 réponses

Réponse 1 / 9

jordane45 Messages postés 38284 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 11 novembre 2024 4 697
8 déc. 2021 à 12:30

Bonjour,

Au lieu de faire une boucle sur tes X pages

 <?php for($page = 1; $page <= $pages; $page++): ?>

Modifies ton code pour ne créer que 1 page avant, la page en cours, et une ou deux pages après ...

C'est plus une question d'algorithmie que de html ou de css ....

Réponse 2 / 9

jordane45 Messages postés 38284 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 11 novembre 2024 4 697
10 déc. 2021 à 22:20

Hello,

Je reviens sur cette discussion...

Perso, j'aurais sûrement fait un truc du genre

<?php
function getNavLink($currentPage=1,$numPage=1){
  $disabled = $currentPage == $numPage ? "disabled" : "" ;
  return  '<li class="page-item '.$disabled.'">
        <a href="?page='.$numPage.'" class="page-link">'.$numPage.'</a>
    </li>';
}
?>

<div class="container" style=" max-width: 100%;margin:auto;">
  <nav>
  <ul class="pagination">
    <!-- Lien vers la page précédente (désactivé si on se trouve sur la 1ère page) -->
    <?php
    //première page 
      if($currentPage >2 ){
        echo getNavLink($currentPage,1 );
      }
    
      //page actuelle moins 1
      if($currentPage >1 ){
        echo getNavLink($currentPage,$currentPage -1);
      }
      
      //page actuelle 
      echo getNavLink($currentPage,$currentPage);
      
      //page actuelle plus 1
      if($currentPage < $pages + 1 ){
        echo getNavLink($currentPage,$currentPage +1);
      }
      
      //Dernière page
      if($currentPage < $pages + 2 ){
        echo getNavLink($currentPage,$currentPage +2);
      }
      
    ?>
  </ul>
</nav>

</div>

jordane45 Messages postés 38284 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 11 novembre 2024 4 697
11 déc. 2021 à 10:02

pardon...

Oui

   
      //page actuelle plus 1
      if($currentPage < $pages - 1 ){
        echo getNavLink($currentPage,$currentPage +1);
      }
      
      //Dernière page
      if($currentPage < $pages - 2 ){
        echo getNavLink($currentPage,$currentPage +2);
      }

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187 > jordane45 Messages postés 38284 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 11 novembre 2024
11 déc. 2021 à 10:13

Merci Jordanne pour la correction
mais cette fois c est la page 16 qui ne veux plus s afficher ...
concernant le nombre de sortie il est bien calculer et je possède la bonne valeur
la variable est affichée en haut du tableau
https://phil.pecheperle.be/journee-peche/journees-de-peche3.php

jordane45 Messages postés 38284 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 11 novembre 2024 4 697 > flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024
11 déc. 2021 à 10:26

Je ne suis pas bien réveillé ce matin..

      //page actuelle plus 1
      if($currentPage < $pages  ){
        echo getNavLink($currentPage,$currentPage +1);
      }
      
      //Dernière page
      if($currentPage < $pages - 1 ){
        echo getNavLink($currentPage,$currentPage +2);
      }

nickel jordane un super grand merci ,
c 'est super

bon week end
et merci pour toute ton aide depuis des mois

Réponse 3 / 9

cactux Messages postés 3 Date d'inscription mercredi 17 janvier 2007 Statut Membre Dernière intervention 11 décembre 2021 1
11 déc. 2021 à 23:24

Salut,
Je ne sais pas si ça peut t'aider, mais pour la pagination, j'utilise cette classe PHP :
https://github.com/ashish101184/ashish/blob/master/wordpress%20plugin/wp-homegrid/pagination.class.php
Malheureusement plus mis à jour depuis quelques années, donc pas responsive.
J'ai commencé à transformer cette classe PHP pour la rendre compatible avec Bootstrap 5.

Réponse 4 / 9

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
8 déc. 2021 à 15:34

bonjour Jordane

merci pour l aide
Mais sur ce coup j avoue ne pas trop bien suivre

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 9

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
9 déc. 2021 à 00:29

<?php for($page = 1; $page <= $pages; $page++): ?>

donc je reviens pour essayer de comprendre , car aucun essais que je fais ne fonctionne

$page = 1;

est la page du départ
si je la modifie je suis en page 2 ou 3

$page <= $pages

c est ma page courante

et enfin

$page++

c est l incrément des pages

donc d après ce que je peux comprendre je dois modifier cette partie

$page <= $pages

si j écris ceci

$page,$page  <= $pages

cela plante entre autre
j'ai essaye une multitude de combinaisons

jordane45 Messages postés 38284 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 11 novembre 2024 4 697
9 déc. 2021 à 00:54

Non mais il faut enlever la boucle
Et mettre trois boutons
: un pour la page précédente un pour la page en cours et un pour la page suivante.
Quand je dis un..., tu peux faire deux ou trois à toi de voir..

Réponse 6 / 9

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
Modifié le 9 déc. 2021 à 01:27

merci pour l aide
si je dis que cela fait 4 h00 que je cherche , tu ne me croiras pas et pourtant ..

voila en fait exact une fois la boucle partie il ne me reste plus que suivant et précédant et cela fonctionne

  <?php for($page = 1; $page <= $pages; $page++): ?>
                          <!-- Lien vers chacune des pages (activé si on se trouve sur la page correspondante) -->
                          <li class="page-item <?= ($currentPage == $page) ? "active" : "" ?>">
                                <a href="?page=<?= $page ?>" class="page-link"><?= $page ?></a>
                            </li>
                        <?php endfor ?>

voila ce que je viens de faire

  <li class="page-item"><a class="page-link " href="?page=<?= $page=1 ?>"><span>1</span></a></li>
                             <li class="page-item"><a class="page-link " href="?page=<?= $page=2 ?>"><span>2</span></a></li>
                             <li class="page-item"><a class="page-link " href="?page=<?= $page=3 ?>"><span>3</span></a></li>

et donc de cette façon il ne voit 3 pages et pour voir les suivantes il doit cliquer sur suivant , si j'ai bien compris

Réponse 7 / 9

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
9 déc. 2021 à 02:31

voila tout fonctionne

encore un super très grand merci jordane

Réponse 8 / 9

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
10 déc. 2021 à 23:09

bonsoir Jordane
Merci beaucoup pour le code cela fonctionne nickel sauf dans les dernières pages

je te laisse vérifier

https://phil.pecheperle.be/journee-peche/journees-de-peche3.php

Réponse 9 / 9

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
13 déc. 2021 à 13:24

bonjour
merci pour le lien
mais je préfère la solution de jordane qui est très légère

Discussions similaires

Fichier de pagination insuffisant

[Erreur lors d'une opération de PAGINATION]

comment paginer un doc a partir de la page 3

Deux paginations à la suite sur un même word

Arrêt numérotation des pages