Deux jquery pagination plugin dans la même page ne semble pas fonctionner

J'utilise jquery pagination plugin pour la pagination ... S'il y a un plugin de pagination, il n'y a pas de problème pour moi ... Mais s'il y en a deux on semble travail, mais l'autre ne semble pas trop ... Voici mon code,Deux jquery pagination plugin dans la même page ne semble pas fonctionner

<div id="PagerUp" class="pager"> 

</div><br /><br /><br /> 
    <div id="ResultsDiv"> 

</div> 
<div id="PagerDown" class="pager"> 

</div>

Et mon jquery a,

<script type="text/javascript"> 
     var itemsPerPage = 5; 
     $(document).ready(function() { 
      getRecordspage(0, itemsPerPage); 
      var maxvalues = $("#HfId").val(); 
      $(".pager").pagination(maxvalues, { 
       callback: getRecordspage, 
       current_page: 0, 
       items_per_page: itemsPerPage, 
       num_display_entries: 5, 
       next_text: 'Next', 
       prev_text: 'Prev', 
       num_edge_entries: 1 
      }); 
     }); 

</script>

Voici ce que je veux ...

alt text http://img52.imageshack.us/img52/5618/pagerse.jpg

Les deux œuvres mais regardez la pagerup la page sélectionnée est 3 mais les PagerDown montre 1 .... Comment changer un téléavertisseur sur d'autres téléavertisseurs événement de rappel en jquery ....

EDIT: en utilisant l'idée de mef ne semble pas fonctionner ...

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <script type="text/javascript" src="jquery.js"></script> 
    <link rel="Stylesheet" type="text/css" href="CSS/Main.css" /> 
     <script type="text/javascript" src="Javascript/jquery.pagination.js"> 
     </script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $(".pager").pagination(300, { callback: pagecallback, 
       current_page: 0, 
       items_per_page: 5, 
       num_display_entries: 5, 
       next_text: 'Next', 
       prev_text: 'Prev', 
       num_edge_entries: 1 
      }); 
     }); 
    function pagecallback() { 
     var paginationClone = $("#Pagination > *").clone(true); 
     $("#Pagination2").empty(); 
     paginationClone.appendTo("#Pagination2"); 
    } 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 

<div class="pager" id="pagination"> 
    <!-- the container for your first pagination area --> 
</div> 

<div id="results"> 
    <!-- the container where you show your results --> 
</div> 

<div class="pager" id="Pagination2"> 
    <!-- the container for your second pagination area --> 
</div> 
    </div> 
    </form> 
</body> 
</html>

Source

2010-04-09 Chendur Pandian

Comme cela ne semble pas être officiellement pris en charge, voici une solution de contournement (working demo).

Étape 1 Créez votre balisage HTML comme suit:

<div class="pagination" id="Pagination"> 
    <!-- the container for your first pagination area --> 
</div> 

<div id="results"> 
    <!-- the container where you show your results --> 
</div> 

<div class="pagination" id="Pagination2"> 
    <!-- the container for your second pagination area --> 
</div>

Étape 2 L'idée:
L'idée est maintenant d'utiliser le plugin de pagination comme d'habitude avec la première div pagination . En outre, nous souhaitons copier tout le contenu de la première div de pagination vers la seconde div de pagination chaque fois qu'un changement de page se produit.

Étape 3 Tweak le pageSelect-rappel:
Ajoutez les lignes à la fin de votre fonction de rappel suivantes:

var paginationClone = $("#Pagination > *").clone(true); 
$("#Pagination2").empty(); 
paginationClone.appendTo("#Pagination2");

Il est très important d'inclure le paramètre booléen (withDataAndEvents) avec le .clone appel, sinon la copie de votre pagination n'aura aucun événement de clic.

Maintenant, chaque fois que vous cliquez sur un élément de pagination (qu'il s'agisse de l'original ou de la copie), la page change et les éléments de pagination sont mis à jour en conséquence.

Source

2010-04-12 11:24:34 Leo

@mef cela ne semble pas fonctionner pour moi ... –

@Pandiya Chendur: cela fonctionne définitivement. Double vérifier sur les ID etc ... – Leo

@Mef regarder ma partie éditée de ma question c'est ce que j'ai utilisé ... –

Probablement ce n'est pas la réponse que vous espériez, mais il y a une demande de fonctionnalité pour le plug-in Pagination jQuery qui suggèrent que d'avoir deux téléavertisseurs sur la même page est n ot soutenu par la mise en œuvre actuelle:

http://plugins.jquery.com/node/11825

Source

2010-04-11 12:54:07

Deux jquery pagination plugin dans la même page ne semble pas fonctionner

Répondre

Questions connexes