Answers

• colin Posts: 15,240Questions: 1Answers: 2,599

  November 2020

  We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

  Cheers,

  Colin
• killercode Posts: 8Questions: 1Answers: 0

  November 2020

  Thank you so much, This is my link,

  https://jsbin.com/fojenim/edit?html,css,js,output

  I should mention because I'am using creative-tim libraries, I can't add all of them to my code
• colin Posts: 15,240Questions: 1Answers: 2,599

  November 2020

  I took a look but there are errors in the page. We need a test case that reproduces the problem you want assistance with, so we can investigate and debug.

  Colin
• killercode Posts: 8Questions: 1Answers: 0

  November 2020 edited November 2020

  ok, let me try again, It is default for me when I want create than by creative-tim. css by the way I try to create problem indeed you can see my problem in my images also, you can see my issue clearly in first image I have 2 rows with two entries and second image I have 4 rows but entries is still 2!, without update entries! and then page numbers didn't any changes also, It seems handlebar js can not detect rows added by handlebarsjs.
• kthorngren Posts: 21,341Questions: 26Answers: 4,954

  November 2020 edited November 2020 Answer ✓

  Sounds like you aren't using Datatables API's to add the rows. You can use either row.add() or rows.add() to add multiple rows. Or you can use rows().invalidate() after you add the rows the way you currently are. This will notify Datatables that the HTML table has been updated and to refresh its data cache.

  EDIT: Also see this FAQ.

  Kevin
• killercode Posts: 8Questions: 1Answers: 0

  November 2020

  You mean I should use rows. add() and handelbars. js can't do that for me, ok, I'll check that, but I don't know why I call my variables through backend by hbs DataTables can add rows, paging and entries can update without any problem however when I use handlebars. js in my hbs(html code) in client side it can add rows to Datatables but Datatables can't update entries and paging, thank you so much for your answer
• killercode Posts: 8Questions: 1Answers: 0

  November 2020

  this is my code, but I don't know jsbin can not show handlebarsjs result correctly,may be because it can not load handlebar.js correctly.
  http://live.datatables.net/sudilame/1/
• killercode Posts: 8Questions: 1Answers: 0

  November 2020

  sorry if I'm taking your time to much, this is because this issue is very important for me, I'm trying to implement handlebars. js template on jsbin but I don't know why it does work here, however I changed my code again, I think this link is correct
  http://live.datatables.net/sudilame/1/edit
• kthorngren Posts: 21,341Questions: 26Answers: 4,954

  November 2020 Answer ✓

  Thanks for the test case. It was enough to get started. Looks like you are initializing Datatatables then overwriting the tbody with your rows. Datatables isn't seeing these new rows. You should first build the table then initialize Datatables, like this:
  http://live.datatables.net/sudilame/6/edit

  Kevin
• killercode Posts: 8Questions: 1Answers: 0

  November 2020 edited November 2020

  Thank you so much, your answered fixed my principal issue, but I encounter new problem for first time I ran my code it worked without any error but for second time I got This error "DataTables warning: table id=datatables - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3"

  I add table.destroy() but I did't work correctly

          $('#datatables').DataTable ({
               "pagingType": "full_numbers",
                "lengthMenu": [
                [10, 25, 50, -1],
               [10, 25, 50, "All"],
               ],
             responsive: true,
              language: {
               search: "_INPUT_",
                     searchPlaceholder: "Search records",
                      },
                });
  
       
  
  
        var table = $('#datatables').DataTable();
  
  
    
        table.on('click', '.edit', function() {
          $tr = $(this).closest('tr');
          var data = table.row($tr).data();
          alert('You press on Row: ' + data[0] + ' ' + data[1] + ' ' + data[2] + '\'s row.');
        });
      
  
        table.on('click', '.remove', function(e) {
          $tr = $(this).closest('tr');
          table.row($tr).remove().draw();
          e.preventDefault();
        });
   
    
        table.on('click', '.like', function() {
          alert('You clicked on Like button');
        });
  
           table.destroy();
  
• tangerine Posts: 3,365Questions: 39Answers: 395

  November 2020 Answer ✓

  You are initialising your DT twice, as the error message says.
  Line 1 should be

  var table =   $('#datatables').DataTable ({
  

  then get rid of line 17.
• killercode Posts: 8Questions: 1Answers: 0

  November 2020

  Thank you so much