Edit column table jQuery

Question

Edit column table jQuery

Navigation

#1 by (1 votes)

1

<table id="tabla1">
 <thead>
    <tr>
        <th>Fruta</th>
        <th>Cantidad</th>
        <th>Color</th><!-- necesito editar esta columna-->
    </tr>
 </thead>
<tbody>
    <tr id="1">
        <td>Manzana</td>
        <td>1</td>
        <td>roja</td>
    </tr>

    <tr id="2">
        <td>Frutilla</td>
        <td>3</td>
        <td>Roja</td>
    </tr>

    <tr id="3">
        <td>Pera</td>
        <td>3</td>
        <td>verde</td>
    </tr>


</tbody>
</table>

This is my table I need to edit the column "Color" but only those that have the id of my array:

var id_tr = [1, 2];

And I need to replace it with green.

It would look something like this:

<tr id="1">
        <td>Manzana</td>
        <td>1</td>
        <td>verde</td><!-- remplazo por verde-->
    </tr>

    <tr id="2">
        <td>Frutilla</td>
        <td>3</td>
        <td>verde</td><!-- remplazo por verde-->
    </tr>

Thank you very much!

jquery html

asked by Javier Antonio Aguayo Aguilar 05.06.2017 в 22:30

source

1 answer

Picasso Android Studio Get current coordinate and set it in a text and that does not vary (That shows the one I'm taking at that moment) Android

score 1 · Accepted Answer

You scroll through all the rows of your table:

var id_tr = [1,2];
$("#tabla1").find("tbody").find("tr").each(function(){ //Recorres las filas
     if($.inArray(parseInt($(this).attr("id")), id_tr) > -1){ //Validas que el id de la fila en curso esté en tu arreglo
          $(this).find("td:eq(2)").html("verde"); //Si sí está entonces buscas la tercera columna que es la de colores y cambias el texto a "verde"
     }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="tabla1">
 <thead>
    <tr>
        <th>Fruta</th>
        <th>Cantidad</th>
        <th>Color</th><!-- necesito editar esta columna-->
    </tr>
 </thead>
<tbody>
    <tr id="1">
        <td>Manzana</td>
        <td>1</td>
        <td>roja</td>
    </tr>

    <tr id="2">
        <td>Frutilla</td>
        <td>3</td>
        <td>Roja</td>
    </tr>

    <tr id="3">
        <td>Pera</td>
        <td>3</td>
        <td>verde</td>
    </tr>


</tbody>
</table>