pagination Javascript

Quelqu'un peut-il m'aider s'il vous plaît? Je ai peu de connaissances de JS ... J'ai essayé this exemple, que brianpeiris a écrit .. Cela a bien fonctionné, mais j'ai besoin de deux téléavertisseurs différents dans la même page. Comment puis-je accomplir cela?pagination Javascript

Ce code ne fonctionne pas, mais c'est de savoir jusqu'où je suis arrivé ..

<script type="text/javascript"> 
        var pagination_options = { 
         num_edge_entries: 1, 
         num_display_entries: 8, 
         callback: pageselectCallback, 
         items_per_page:1 
        } 
        function pageselectCallback(page_index, jq){ 
         var items_per_page = pagination_options.items_per_page; 
         var offset = page_index * items_per_page; 
         var new_content = $('#hiddenresult div.result').slice(offset, offset + items_per_page).clone(); 
         $('#Searchresult').empty().append(new_content); 


         var items_per_page = pagination_options.items_per_page; 
         var offset = page_index * items_per_page; 
         var new_content = $('#hiddenresult2 div.result2').slice(offset, offset + items_per_page).clone(); 
         $('#Searchresult2').empty().append(new_content); 
         return false; 

        } 


        function initPagination() { 
         var num_entries = $('#hiddenresult div.result').length; 
         // Create pagination element 
         $("#Pagination").pagination(num_entries, pagination_options); 

         num_entries = $('#hiddenresult2 div.result2').length; 
         // Create pagination element 
         $("#Pagination2").pagination(num_entries, pagination_options);       
        } 


        $(document).ready(function(){  
         initPagination(); 
        });

Source

2010-09-01 artur

essayez ceci:

var pagination_options = { 
    num_edge_entries: 2, 
    num_display_entries: 8, 
    callback: pageselectCallback, 
    items_per_page:3 
}; 
var pagination_options2 = { 
    num_edge_entries: 2, 
    num_display_entries: 8, 
    callback: pageselectCallback2, 
    items_per_page:3 
}; 
function pageselectCallback(page_index, jq){ 
    var items_per_page = pagination_options.items_per_page; 
    var offset = page_index * items_per_page; 
    var new_content = $('#hiddenresult div.result').slice(offset, offset + items_per_page).clone(); 
    $('#Searchresult').empty().append(new_content); 
    return false; 
} 
function pageselectCallback2(page_index, jq){ 
    var items_per_page = pagination_options2.items_per_page; 
    var offset = page_index * items_per_page; 
    var new_content = $('#hiddenresult2 div.result').slice(offset, offset + items_per_page).clone(); 
    $('#Searchresult2').empty().append(new_content); 
    return false; 
} 

function initPagination() { 
    var num_entries = $('#hiddenresult div.result').length; 
    // Create pagination element 
    $("#Pagination").pagination(num_entries, pagination_options); 

    num_entries = $('#hiddenresult2 div.result').length; 
    // Create pagination element 
    $("#Pagination2").pagination(num_entries, pagination_options2) 
} 

    $(document).ready(function(){  
     initPagination(); 
    });

Source

2010-09-01 10:30:06

Merci beaucoup! Tu as sauvé ma journée! P.S. Je viens de changer 'div.result' en 'div.result2' dans le second pager – artur

https://plnkr.co/edit/XFqbVuIa0Sn4rRvE7d0J?p=preview

<head> 
    <script data-require="[email protected]*" data-semver="2.2.0" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <script src="script.js"></script> 
    <style> 
     #footer{ 

     height: 19px; 
     color: light-green; 
     color: blueviolet; 
     background-color: darkcyan; 
     padding: 16px; 
     } 
     .inputboxwidth{ 
     width:16px; 
     } 
     #blackColr{ 
     color:black; 
     } 
     #alignRight{ 
      text-align: right; 
      margin-right:36px; 
     } 
     td{ 
      border: 0px; 
      padding: 6px;  
      width: 10%; 
     } 
    </style> 
    </head> 

    <body> 
    <table border="1" padding="36px"> 
     <thead> 
     <tr> 
      <td>Sno</td> 
      <td>Name</td> 
      <td>RollNO</td> 
      <td>Class</td> 
     </tr> 
     </thead> 
     <tbody></tbody> 
    </table> 
    <div id="footer"> 
     <div id="alignRight"> 
     <input type="text" class="inputboxwidth" id="pageNo" name="pageNo" value=""/> 
     <span id="blackColr">/</span> 
     <input type="text" class="inputboxwidth" id="TotalPageno" name="TotalPageno" disabled=disabled value=""/> 
     </div> 
    </div> 

    <script> 

     $("input#pageNo").change(function() { 
     //console.log("innnnnnnn") 

     var pageno=$(this).val(); 

      var isnum = /^\d+$/.test(pageno); 

     if(pageno>countRecor || !isnum){ 
     $("input#pageNo").val(previousPage); 
     pageno=previousPage 
     } 
     var gotorecor=dispRecor*pageno-5; 
     var body1=$("tbody"); 
     $("tbody").text("") 
     var temp=[]; 
     for(i=gotorecor;i<=gotorecor+4;i++){ 
      temp.push(data[i]); 
     } 
     makeData(gotorecor,gotorecor+4,temp); 
     }); 

     function makeData(startingRecordNumber,dispRecor,data){ 
     previousPage=$("input#pageNo").val(); 
      var body=$("tbody"); 
      var count=0; 
      EndingRecordNumber=dispRecor 
      $.each(data, function(rowIndex, r) { 
      count++; 
      if(count==6){ 
       return false; 
      } 
     var row = $("<tr/>"); 
     $.each(r, function(colIndex, c) { 
      row.append($("<td/>").text(c)); 
     }); 
     body.append(row); 
     }); 
     } 

     $(document).ready(function() { 
     $("#pageNo").val("1"); 
      data = [ 
       ["1","New York", "LA", "Seattle"], 
       ["2","Paris", "Milan", "Rome"], 
       ["3","Pittsburg", "Wichita", "Boise"], 
         ["4","New York", "LA", "Seattle"], 
         ["5","New York", "LA", "Seattle"], 
         ["6","New York", "LA", "Seattle"], 
         ["7","New York", "LA", "Seattle"], 
         ["8","New York", "LA", "Seattle"], 
         ["9","New York", "LA", "Seattle"], 
         ["10","New York", "LA", "Seattle"], 
         ["11","New York", "LA", "Seattle"], 
         ["12","New York", "LA", "Seattle"], 
         ["13","New York", "LA", "Seattle"], 
         ["14","New York", "LA", "Seattle"], 
         ["15","New York", "LA", "Seattle"], 
          ["16","New York", "LA", "Seattle"]] 
     countRecor=Math.ceil(data.length/5); 
     dispRecor=5; 
     $("#TotalPageno").val(countRecor); 

     makeData(0,dispRecor,data); 
     }); 
    </script> 
    </body> 

</html>

Source

2016-03-05 06:21:56 javabrainer

pagination Javascript

Répondre

Questions connexes