Answers

• allan Posts: 63,160Questions: 1Answers: 10,406 Site admin

  March 2018

  All of your other ones are using .innerHTML apart from your first one - that would explain the error.

  Allan
• ckiii Posts: 5Questions: 1Answers: 0

  March 2018

  Hi Allan,

  I understand that. I was kinda showing that I can only see data if it is assigned via .innerHTML. I can populate the tds but it is stripping all classnames and accompanying properties from them.

  How can I send the data for the row's classname and the cells' classnames?
• allan Posts: 63,160Questions: 1Answers: 10,406 Site admin

  March 2018 Answer ✓

  Ah I see what you mean. If you want to insert a DOM node, you need to construct the full tr. If you pass a tr element to row.add() it will read and use the nodes, but there isn't any option to pass in individual td element I'm afraid.

  Allan
• ckiii Posts: 5Questions: 1Answers: 0

  March 2018

  I feel like you mean that I need to setup the nodes in the

  var dtable = $('#ledgerentrytable').DataTable()
  

  but am unclear exactly how to do it. I believe it would be

  var dtable = $('#ledgerentrytable').DataTable({
  "rows" = [
  "class" : "gradeA mainRow edited"],
  "columns" = [
  "class" : "center",
  "class" : "center",
  "class" : "center",
  "class" : "center",
  "class" : "center",
  "class" : "center",
  "class" : "center",
  "class" : "center"]})
  

  But this isnt working

  When looking at this example

  var table = $('#example').DataTable();
   
  var rowNode = table
      .row.add( [ 'Fiona White', 32, 'Edinburgh' ] )
      .draw()
      .node();
   
  $( rowNode )
      .css( 'color', 'red' )
      .animate( { color: 'black' } );
  

  it shows only applying a row, no column properties and no example of actually adding classes. Also there's no destroy, when does that come in to play? I thought we had to destroy it right away it add to it.

  When I add node() to my draw() I get an error stating that dtable.draw().node is NOT a function.

      dtable.row.add([cell1.innerHTML, cell2.innerHTML, cell3.innerHTML, cell4.innerHTML, cell5.innerHTML, cell6.innerHTML, cell7.innerHTML, cell8.innerHTML])
  
      dtable.draw().node();
  
• ckiii Posts: 5Questions: 1Answers: 0

  March 2018 edited March 2018

  Ok So I have worked out that in order to add className to row I use this

      var rowNode = dtable
          .row.add([cell1.innerHTML, cell2.innerHTML, cell3.innerHTML, cell4.innerHTML, cell5.innerHTML, cell6.innerHTML, cell7.innerHTML, cell8.innerHTML])
          .draw()
          .node();
  
      $(rowNode).addClass("gradeA mainRow edited");
  

  But what about the TD? How do I add the className to that?

  I tried adding

      $(cell1).addClass("center");
      $(cell2).addClass("center");
      $(cell3).addClass("center");
      $(cell4).addClass("center");
      $(cell5).addClass("center");
      $(cell6).addClass("center");
      $(cell7).addClass("center");
      $(cell8).addClass("center");
  

  but that did not work. Do I have to re-declare the table and walk through that process a second time?
• ckiii Posts: 5Questions: 1Answers: 0

  March 2018

  I was able to resolve with this

      var rowNode = dtable
          .row.add([cell1.innerHTML, cell2.innerHTML, cell3.innerHTML, cell4.innerHTML, cell5.innerHTML, cell6.innerHTML, cell7.innerHTML, cell8.innerHTML])
          .draw()
          .node();
  
      $(rowNode).addClass("gradeA mainRow edited");
  
      $(rowNode).children(cell1).addClass("center");
      $(rowNode).children(cell2).addClass("center");
      $(rowNode).children(cell3).addClass("center");
      $(rowNode).children(cell4).addClass("center");
      $(rowNode).children(cell5).addClass("center");
      $(rowNode).children(cell6).addClass("center");
      $(rowNode).children(cell7).addClass("center");
      $(rowNode).children(cell8).addClass("center");
  
• allan Posts: 63,160Questions: 1Answers: 10,406 Site admin

  March 2018

  Yup - that would work. Although I was actually meaning that you should do something like:

  var row = document.createElement('tr');
  row.appendChild( cell1 );
  row.appendChild( cell2 );
  ...
  
  dtable.row.add( row ).draw();
  

  Allan