Comment rendre ma pagination responsive

Résolu/Fermé

flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 - Modifié le 8 déc. 2021 à 07:56
flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 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
Rendre un fichier moins volumineux - Guide
Rendre une cle usb bootable - Guide
Comment nettoyer son mac pour le rendre plus rapide - Guide
Erreur lors d'une opération de pagination ✓ - Forum Matériel & Système
Comment arrêter la pagination à une certaine page - Forum Word

9 réponses

Réponse 1 / 9

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
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 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
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 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
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 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 2024 187 > jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 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 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > flexi2202 Messages postés 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 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 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 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 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 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 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
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 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 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 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 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 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 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 3795 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 avril 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

rendre un texte flou plus net

Rendre un téléphone inutilisable et irréparable

Deux paginations à la suite sur un même word

comment rendre un fichier lisible et non duplicable à la fois?

Discussions similaires

Newsletters