Double pagination en javascript
Bonjour à tous et à toutes,
Dans le cadre de l'un de mes sites, j'ai réalisé une pagination pour afficher des commentaires. Je change chaque numéro de la pagination en fonction du numéro de page sélectionné par l'utilisateur. Je masque aussi certains numéros de pages, en fonction de la page où l'utilisateur se trouve (par exemple si il est page 1, je ne lui laisse pas la possibilité de cliquer pour aller sur pages 0 et -1, car elles n'existent pas)
Partie javascript :
Code:
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
46
| function pag_com()
{
if(no_page > 1)
{
document.getElementById("page-1").firstChild.nodeValue = no_page-1;
document.getElementById('page-1').style.display='inline';
document.getElementById('prec').style.display='inline';
document.getElementById('prem').style.display='inline';
}
else
{
document.getElementById('page-1').style.display='none';
document.getElementById('prec').style.display='none';
document.getElementById('prem').style.display='none';
}
if(no_page > 2)
{
document.getElementById("page-2").firstChild.nodeValue = no_page-2;
document.getElementById('page-2').style.display='inline';
}
else
{
document.getElementById('page-2').style.display='none';
}
document.getElementById("page+2").firstChild.nodeValue = no_page+2;
document.getElementById("page+1").firstChild.nodeValue = no_page+1;
document.getElementById("page_actuel").firstChild.nodeValue = no_page;
if(no_page == nbr_total_pages_com)
{
document.getElementById('sui_com').style.display='none';
document.getElementById('last_com').style.display='none';
document.getElementById('page+2').style.display='none';
document.getElementById('page+1').style.display='none';
}
else
{
document.getElementById('sui_com').style.display='inline';
document.getElementById('last_com').style.display='inline';
document.getElementById('page+2').style.display='inline';
document.getElementById('page+1').style.display='inline';
}
} |
Partie html :
Code:
1
2
3
4
5
6
7
8
9
| <a onclick="javascript:no_page=1;" id="prem" class="numero_pagination_com" style="display:none;">Prem</a>
<a onclick="javascript:no_page-=1;" id="prec" class="numero_pagination_com" style="display:none;"><< Prec</a>
<a onclick="javascript:no_page-=2;" id="page-2" class="numero_pagination_com" style="display:none;"> </a>
<a onclick="javascript:no_page-=1;" id="page-1" class="numero_pagination_com" style="display:none;"> </a>
<a onclick="recup_com('zone_com');javascript:no_page+=0;" id="page_actuel" class="numero_pagination_com" style="font-weight:bold;background-color:#2F617F;color:#FFFFFF;">1</a>
<a onclick="javascript:no_page+=1;" id="page+1" class="numero_pagination_com">2</a>
<a onclick="javascript:no_page+=2;" id="page+2" class="numero_pagination_com">3</a>
<a onclick="javascript:no_page+=1;" id="sui_com" class="numero_pagination_com">Suiv >></a>
<a onclick="javascript:no_page=15;" id="last_com" class="numero_pagination_com">Der</a> |
Mon script fonctionne bien (je l'ai couplé avec de l'ajax qui charge chaque page). Mon problème est juste que je n'arrive pas a afficher deux zones de pagination (la partie en html), je souhaiterais en effet qu'il n'y ait une au début des commentaires et une autre à la fin. Sachant que les deux zones de pagination doivent être liées (quand la page 5 est sélectionnée dans la première zone de pagination, elle doit aussi l'être dans la seconde). J'ai essayé diverses méthodes mais je me retrouve avec quelque chose de bcp trop lourd à la fin (tout en double...), y'a t'il une solution simple à ce problème ?
Merci pour votre aide.
