Discussion :

[kizery]

Bonjour à tous et désolé si je poste pas au bon endroit !

Voila, je m’arrache les cheveux depuis des heures sur ce code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<script>
    $('#home').click(function() {
        $('#bloc_page').twbsPagination({
            totalPages: parseInt('<?php echo $nombre_pages; ?>'),
            visiblePages: parseInt('<?php echo $nombre_pages; ?>'),
            next: 'Next',
            prev: 'Prev',
            onPageClick: function(event, page) {
                var param = 'l=' + page + 'home';
 
                //fetch content and render here
                $('#contenu_site').load('affichegallery.php', param);
            }
        });
        $(this).css('font-weight', 'bold');
        $(this).css('cursor', 'default');
        $(this).attr("disabled", true);
        $('#vietnam').attr("disabled", false);
        $('#vietnam').css('cursor', 'pointer');
        $('#vietnam').css('font-weight', 'normal');
    });
 
    $('#vietnam').click(function() {
        $('#bloc_page').twbsPagination({
            totalPages: parseInt('<?php echo $nombre_pages; ?>'),
            visiblePages: parseInt('<?php echo $nombre_pages; ?>'),
            next: 'Next',
            prev: 'Prev',
            onPageClick: function(event, page) {
                var param = 'l=' + page + 'vietnam';
 
                //fetch content and render here
                $('#contenu_site').load('affichegallery.php', param);
            }
        });
        $(this).css('font-weight', 'bold');
        $(this).css('cursor', 'default');
        $(this).attr("disabled", true);
        $('#home').attr("disabled", false);
        $('#home').css('cursor', 'pointer');
        $('#home').css('font-weight', 'normal');
    });
</script>

Quand je clique sur un bouton, "home" ou "vietnam" Tout ce qui est balise css fonctionne bien, on passe des une aux autres en fonction du bouton cliqué. Par contre, ces bouton doivent aussi envoyer un paramètre, qui est différent selon le bouton cliqué, à la page php "affichegallery.php" et ça, ça ne marche pas !

Si je clique sur un premier bouton, home par exemple, je récupère bien son paramètre (param = 'l=' +page +'home') et quand je clique sur l'autre bouton je devrais récupérer le paramatre correspondant (param = 'l=' +page + 'vietnam'). Hélas j'ai toujours le paramètre du premier bouton qui reste en mémoire ! Je ne comprends pas du tout pourquoi j'en deviens fou ! Si quelqu'un peut étudier mon code et me dire ce qui va pas, je lui en serai très reconnaissant !

Merci d'avance !

[Watilin]

Bonjour,
je ne connais pas le plugin twbsPagination mais je pense qu’il est fait pour que tu ne l’appelles qu’une seule fois sur un élément donné – en l’occurence l’élément '#bloc_page'.

Le problème c’est qu’à chaque fois que tu cliques sur un de tes boutons, le plugin est appelé à nouveau. J’ai deux hypothèses :

1. Le plugin détecte ce cas de figure et choisit d’ignorer les appels suivants ;
2. le comportement est indéfini.

Comme on ne sait pas laquelle de ces deux hypothèses est la bonne (à moins de regarder le code du plugin, mais j’ai la flemme), il vaut mieux éviter un comportement indéfini en réécrivant ton code pour qu’il ne fasse qu’un seul appel à twbsPagination.

Ce que je te propose, c’est d’appeler le plugin au chargement de la page, et de garder en mémoire deux variables :

• l’une indiquant lequel des boutons « home » ou « vietnam » a été cliqué en dernier ;
• l’autre indiquant quel numéro de page est demandé.

Bien sûr on donne des valeurs par défaut à ces deux variables car, au chargement de la page, rien n’a encore été cliqué.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
$(document).ready(function ($) {
  'use strict';
 
  var nbPages = parseInt('<?php echo $nombre_pages; ?>');
 
  var clickedButton = 'home';
  var requestedPage = '1';
 
  var reloadGallery = function () {
    var param = 'l=' + requestedPage + clickedButton;
 
    //fetch content and render here
    $('#contenu_site').load('affichegallery.php', param);
  };
 
  // appelle le plugin une seule fois
  $('#bloc_page').twbsPagination({
    totalPages   : nbPages,
    visiblePages : nbPages,
    next         : 'Next',
    prev         : 'Prev',
    onPageClick  : function (event, page) {
      requestedPage = String(page);
      reloadGallery();
    },
  });
 
  // ajoute l’écouteur de click sur les deux boutons à la fois
  $('#home, #vietnam').click(function () {
    var $thisButton = $(this);
 
    clickedButton = $thisButton.attr('id');
    reloadGallery();
 
    $('#home, #vietnam')
      .css('font-weight', 'normal');
      .css('cursor', 'pointer')
      .attr('disabled', false);
 
    $thisButton
      .css('font-weight', 'bold')
      .css('cursor', 'default')
      .attr('disabled', true);
  });
});