Select values of a row when clicking

Question

Select values of a row when clicking

Navigation

#1 by (0 votes)

-2

I have the following problem: There is a table with several rows and columns, I wish that with the mouse I click on a row and I separated three values of the six columns that I have. But, the values obtained should be ONLY OF THAT ROW.

Annex the code that I have:

$(document).ready(function() {
    $("#dataGrid tr").on('click', function() {
        var toma1 = "", toma2 = "", toma3 = ""; 
            $("#dataGrid").find("tr").each(function() {
                toma1 += $(this).find('td:eq(1)').html();
                toma2 += $(this).find('td:eq(3)').html();
                toma3 += $(this).find('td:eq(5)').html();
           }); 
        $("#respuesta").text(toma1 + toma2 + toma3);
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="dataGrid">
         <tr>
            <td>1111111</td>
            <td>222222</td>
            <td>3333333</td>
            <td>4444444</td>
            <td>55555555</td>
            <td>66666</td>
        </tr>
  </table>
  
  <label id="respuesta"><label>

jquery html

asked by peluca 27.09.2017 в 17:48

source

1 answer

Is it possible to assign the data collected by keyboard to a class outside the main in c #? Show errors in Laravel

score 0 · Answer 1

What you can try is to avoid the each() , because that makes you go to each row, when what you want is only from the row where you are clicking. Basically just delete the function each() of your code and put a couple more rows to check the example.

$(document).ready(function() {
    $("#dataGrid tr").on('click', function() {
        var toma1 = "", toma2 = "", toma3 = ""; 
                toma1 += $(this).find('td:eq(1)').html();
                toma2 += $(this).find('td:eq(3)').html();
                toma3 += $(this).find('td:eq(5)').html();
 
        $("#respuesta").text(toma1 + toma2 + toma3);
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="dataGrid">
         <tr>
            <td>a1111111</td>
            <td>a222222</td>
            <td>a3333333</td>
            <td>a4444444</td>
            <td>a55555555</td>
            <td>a66666</td>
        </tr><tr>
            <td>b1111111</td>
            <td>b222222</td>
            <td>b3333333</td>
            <td>b4444444</td>
            <td>b55555555</td>
            <td>b66666</td>
        </tr>
        <tr>
            <td>c1111111</td>
            <td>c222222</td>
            <td>c3333333</td>
            <td>c4444444</td>
            <td>c55555555</td>
            <td>c66666</td>
        </tr>
  </table>
  
  <label id="respuesta"><label>