¿ Cómo agregar clase css a fila de una tabla usando DataTable?

publicado por: Anonymous

Estoy creando las filas de una tabla con la librería DataTable Jquery y deseo agregar un estilo a una fila, las filas las genero de esta manera.

      // idTabla es una variable que la envió desde la vista **var idTabla = DataTable();**
            idTabla.row().clear();
            for (var i = 0; i < datos.length ; i++) {
                if (datos[i].estado == '1') {
                    var icon = "<i class='fa fa-check' id='loadState"+datos[i].id+"'></i>";
                }else{
                    var icon = "<i class='fa fa-ban' id='loadState"+datos[i].id+"'></i>";
                }
                //
                idTabla.row.add([
                                    datos[i].id,  
                                    datos[i].nombre,
                                    "<div class=' text-center col-md-12'><a href='#' id='editarObservacion"+datos[i].id+"' class=' ' onclick='activarDesActivarElect(""+datos[i].id+"", "2", "loadState"+datos[i].id+"", ""+id+"", ""+datos[i].estado+"")'> "+icon+" </a></div>"
                                ]);
            }
            idTabla.draw(true);

La intención de lo anterior es que cuando entre a el else agregue a toda la fila un color de letra diferente y de esta manera identificar los datos que entran con el estado != 1

solución

Al final logre agregar la clase de esta forma, dejo el código a continuación para que sirva a alguien que alguna vez tenga este mismo cuestionamiento

        idTabla.row().clear();
        for (var i = 0; i < datos.length ; i++) {
            if (datos[i].estado == '1') {
                icon = "<i class='fa fa-check' id='loadState"+datos[i].id+"'></i>";
            }else{
                icon = "<i class='fa fa-ban' id='loadState"+datos[i].id+"'></i>";
            }
            //
            idTabla.row.add([
                                datos[i].id,  
                                datos[i].nombre,
                                "<div class=' text-center col-md-12'><a href='#' id='editarObservacion"+datos[i].id+"' class=' ' onclick='activarDesActivarElect(""+datos[i].id+"", "2", "loadState"+datos[i].id+"", ""+id+"", ""+datos[i].estado+"")'> "+icon+" </a></div>"
                            ]);
            // agrego el idTabla.draw(true); dentro de el for
            idTabla.draw(true);
            if (datos[i].estado == '0') {
                // al parecer sorting_1 es una clase por defecto del plugin
                // allí encuentra un dato que contenga algo relacionado a la fila, en este caso es el id
                // utilizó parent() para asignarle una clase al "<td>" donde realiza lo que necesitaba
                $(".sorting_1:contains('" + datos[i].id + "')").parent().addClass('text-muted');
            }
        }
Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *