Clever Geek Handbook

Highlight row after editing in datatables

I am new to JQuery and Javascript.

I am using datatables to show some data

I am trying to highlight certain lines i.e. lines edited after inline editing. I am using inline editing (from https://github.com/ejbeaty/CellEdit ). The code I changed in "Advanced.js" looks like this:

    function myCallbackFunction (updatedCell, updatedRow, oldValue) {



   if (updatedCell.data() == "Bradley")
        {
            console.log("highlight required for Name Bradley")
            $(updatedRow).css( "background-color", "Orange" )

        }

    console.log("The new value for the cell is: " + updatedCell.data());
    console.log("The old value for that cell was: " + oldValue);
    console.log("The values for each cell in that row are: " + updatedRow.data());
}

In a callback function, I am trying to change the background color for a specific name. I can see the .log console but the color changes don't seem to be busy.

+3


source to share


2 answers


Didn't know this plugin CellEdit

before, but it looks really nice, decent and straightforward. Instead of copying the example, it is sometimes better to create a small, minimal example from scratch. Look at this

var table = $('#example').DataTable({
}).MakeCellsEditable({
  onUpdate: function(cell, row, oldValue) { 
    if (cell.data() != oldValue) {
      row.nodes().to$().addClass('highlight')
    }   
  }
})


I forgot .nodes()

in the comment, sorry for that, but the above works -> http://jsfiddle.net/Lccju5bq/

+1


source


try this



  if (updatedCell.data() == "Bradley")
    {
        console.log("highlight required for Name Bradley")
        var updatedRow = document.getElementbyId("updatedRow);
        updatedRow.style.background = 'black';

    }
0


source






More articles:


All Articles