Answers

• spiderkzn Posts: 44Questions: 12Answers: 0

  September 13

  I can customize the background color on cell no problem. Just search filter I need help with.
• allan Posts: 63,498Questions: 1Answers: 10,470 Site admin

  September 13

  How are you applying the background colour? Can you link to an example please?

  Allan
• spiderkzn Posts: 44Questions: 12Answers: 0

  September 13

  customize: function (doc, row) {
  //header color
  $(doc.document.body)
  .find("table thead tr th")
  .addClass(
  "datatable-header-background-color",
  );

  var _table = $("#example").DataTable();
  
  //count how many row on table
  var v = _table.column(1).data().toArray();
  
  for (var i = 0; i < v.length; i++) {
  
      //custom the color for print review
      $(doc.document.body)
          .find("table tbody tr:nth-child(" + (i + 1) + ") td:nth-child(4)")
          .addClass(CodeColor(_table.cell(i, 3).data()));
  }
  

  },

  Note, the CodeColor() is the function that match the value (switch) which it will use the css for background-color.

  So when you input search function. it show what I need to look. But when in print. it show different color background that not match to value.
• spiderkzn Posts: 44Questions: 12Answers: 0

  September 13

  By the way in previous post that I have problem with bootstrap4 and found other way to bypass it but this is search filtering.
• spiderkzn Posts: 44Questions: 12Answers: 0

  September 13

  Look like I've found a way to use rows and every function.

  var _table = $("#example").DataTable();

  _table.rows({
  search: "applied",
  })
  .every(function (
  rowIdx,
  tableLoop,
  rowLoop,
  ) {
  (how to insert background color on specific column)
  });

  So only thing is how to addClass on speciifc column on bold above.
• allan Posts: 63,498Questions: 1Answers: 10,470 Site admin

  September 14

  Use cell().node(). You have the row index from rowIdx and you know your column index, so:

  _table.cell(rowIdx, colIdx).node().classList.add('myBoldClass');
  

  should hopefully do it.

  Allan
• spiderkzn Posts: 44Questions: 12Answers: 0

  September 16

  did use this and it return error:

  TypeError: Cannot read properties of undefined (reading 'classList')
• allan Posts: 63,498Questions: 1Answers: 10,470 Site admin

  September 16

  If you can link to a page showing the issue I can take a look and see what is going wrong.

  Thanks,
  Allan
• spiderkzn Posts: 44Questions: 12Answers: 0

  September 16

  Hi allan,

  I have working on it all day. So I found a way to use rowLoop

  _table.rows({
  search: "applied",
  })
  .every(function (
  rowIdx,
  tableLoop,
  rowLoop,
  ) {

  $(doc.document.body)
  .find(
  "table tbody tr:nth-child(" +
  (rowLoop + 1) + // rowLoop is depend row in loop. ** Do not use rowIdx which is start from begin.
  ") td:nth-child(4)",
  )
  .addClass(CodeColor(_table.cell(i, 3).data()));
  ),
  );

  });