Paint cell of a php dataTable

Question

Paint cell of a php dataTable

Navigation

#1 by (1 votes)

0

I have a problem that I have not been able to solve. I have a table with 3 columns.

Nombre  |  Nota  |  Rango  |
-------------------------------
Pepe    |   5    | Excelente
María   |   3    | Bueno
Luis    |   1    | Malo

I want the cell to be green if it is excellent, if it is good blue and bad red, but it is painting the whole row and I want it to paint only the cells of the rank column. I have this code.

$(document).ready(function(){
$('#mitabla').DataTable({ 
"scrollX": true,

 "rowCallback": function( Row, Data) {
    if ( Data[2] == "Excelente" )
    {
        $('td', Row).css('background-color', 'Green');
    }
    else if ( Data[2] == "Bueno" )
    {
        $('td', Row).css('background-color', 'Blue');
    }
    else if ( Data[2] == "Malo" )
    {
        $('td', Row).css('background-color', 'Red');
    }
 },

What I want to do is possible?

javascript php css

asked by Scorpion 09.07.2017 в 03:07

source

1 answer

onchange event in IE when modifying input value programmatically Castings on derived class objects

score 1 · Accepted Answer

What happens is that you have to select the third column of the row by the index and we apply the style to that column.

We are looking for all td of tr current and we get the td of index 2 and we apply the style.

$(document).ready(function(){
  
  $("table").dataTable({
    
    rowCallback:function(row,data)
    {
      
      if(data[2] == "Excelente")
      {
        $($(row).find("td")[2]).css("background-color","green");
      }
      else if(data[2] == "Bueno"){
          $($(row).find("td")[2]).css("background-color","blue");
      }
      else{
          $($(row).find("td")[2]).css("background-color","red");
      }
      
    }
    
  });
  
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script> 

  <table>
    <thead>
      <tr>
        <th>
          Nombre
        </th>
        <th>
          Nota
        </th>
        <th>
          Rango
        </th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>Pepe</td>   <td>  5   </td>
        <td>Excelente</td>
      </tr>
            <tr>
        <td>María   </td>   <td> 3   </td>
        <td>Bueno</td>
      </tr>
                  <tr>
        <td>Luis       </td>   <td> 1   </td>
        <td>Malo</td>
      </tr>
    </tbody>
  </table>