jquery - Creating n number of buttons (or variable number of buttons) in JavaScript -


i new javascript , having difficulty task. writing code paginate table have. right logic related buttons hard coded , want make more dynamic. meaning, have 5 buttons have separate code same thing , want refactor code have n buttons , 1 script controls them.

i want code generate (total records/number of records per page) number of buttons, want take value of button , pass existing code grab right section of data table.

how do though? of documentation i've found jquery libraries datatables (which spent hour working , did not display anything).

i appreciate tips, tricks, or tutorials.

edit

    $(document).ready(function () {         $('#b1').click(function () {             var data = $("#isgeo").serializearray();             data.push({ name: "page", value: '1' })             $.ajax({                 type: 'get',                 url: '@url.action("gettable", "subsidencepoints")',                 data: $.param(data),                 cache: false,                 processdata: false,                 contenttype: false             }).done(function (result) {                 $('#sub-table').html(result);                 });          $('#b2').click(function () {             var data = $("#isgeo").serializearray();             data.push({ name: "page", value: '2' })                 $.ajax({                     type: 'get',                     url: '@url.action("gettable", "subsidencepoints")',                     data: $.param(data),                     cache: false,                     processdata: false,                     contenttype: false                 }).done(function (result) {                     $('#sub-table').html(result);                     });  

pretty easy. have create loop loop through total number of buttons , use createelement create button , attach event programmatically. check out following code.

<div id="nav-buttons">    </div>    <script>        var totalrecords = 500;  var recordsperpage = 50;    var totalbuttons = totalrecords/recordsperpage;  var navbuttons = document.getelementbyid("nav-buttons");    console.log(totalbuttons)  (var b=0; b<totalbuttons;b++)  {    var button = document.createelement("button");    button.setattribute("pageto", b);    button.innerhtml="page " + b;    navbuttons.appendchild(button);        button.addeventlistener("click", function(event) {      var btn = event.target;      var page = btn.getattribute("pageto");      navbuttons.appendchild(btn);      alert(page);      // goto(page) -- write function getting records page[page]      });       }    </script>


Comments

Popular posts from this blog

mysql - Dreamhost PyCharm Django Python 3 Launching a Site -

java - Sending SMS with SMSLib and Web Services -

java - How to resolve The method toString() in the type Object is not applicable for the arguments (InputStream) -