How to apply pagination in dojo -


is there type of pagination allows user enter page number available not similar goto button in dojo pagination?

here's example of mean:

in example, there text box in user can specify page number , afterwards taken respective page.

can done? if so, can u please me ... in advance.

script.js

  function paginate(){      //create pagination buttons      if(data.length  >= 5){         for(var y = 0; y < data.length / 5 ; y++) { // divide 5 results per page equal 5             var button = document.createelement("button");             button.setattribute("id", "pagination-button" + (y+1).tostring());             button.setattribute("class", "pagination-button center");             button.setattribute("onclick", "nav(id)");             var text = document.createtextnode((y + 1).tostring());             button.appendchild(text);             document.body.appendchild(button);         }     } } function removechildnodes() {     document.getelementbyid("searchresults").innerhtml = ""; } function nav(id){     removechildnodes()     showpages(document.getelementbyid(id).innerhtml); } function showpages (pagenum) {     //get upperbound reults     pagenum = parseint(pagenum);     var upperboundresults = (pagenum * 5); // gets increments of 5 per page if page 1 , 5 results     //get lower bound results start @      var lowerboundresults = (upperboundresults - 5); // if page 2, lower bound 5 upper 10     for(lowerboundresults; lowerboundresults<upperboundresults; lowerboundresults++) {         if(data[lowerboundresults]) {              document.getelementbyid("searchresults").innerhtml += "<div class='center'>" +              "name: "   + data[lowerboundresults].title      + "</div>";              } else {                 break; // breaks if no longer results throw error             }         } }  showpages(1); paginate();  index.html     <!doctype html>     <html>      <head>          <link rel="stylesheet" type="text/css" href="style.css">      </head>     <body>     <div id="searchresults"></div>      </body>     <script type="text/javascript" src="script.js"></script>     </html>

what make paginate button every 5 entries. so, create json object in data, , should go.


Comments

Post a Comment

Popular posts from this blog

javascript - AngularJS custom datepicker directive -

i make custom datepicker directive custom template. but have no idea how start building it... how include date data directive? i appreciate guide or give me advice work on more precisely. it might you! follow below steps html code sample: <label>birth date</label> <input type="text" ng-model="birthdate" date-options="dateoptions" custom-datepicker/> <hr/> <pre>birthdate = {{birthdate}}</pre> <script type="text/ng-template" id="custom-datepicker.html"> <div class="enhanced-datepicker"> <div class="proxied-field-wrap"> <input type="text" ui-date-format="yy-mm-dd" ng-model="ngmodel" ui-date="dateoptions"/> </div> <label> <button class="btn" type="button"><i class="icon-calendar"></i>
Read more

javascript - jQuery date picker - Disable dates after the selection from the first date picker -

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jquery ui datepicker - default functionality</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"> <script> $(function () { $("#datepicker1").datepicker(); }); </script> <script> $(function () { $("#datepicker2").datepicker(); }); </script> </head> <body> <p>date 1: <input type="text" id="datepicker1"></p> <p>date 2: <input type="t
Read more