Take value from a cell in jquery

Question

Take value from a cell in jquery

Asked 7 years, 1 month ago

Viewed 271 times

-2

This button has an ONCLICK event that calls a function. Theoretically, it is already in a line, it would only need the VALUE of a cell.

Obs: Addresses is the ID of tbody and the TEST is the CELULA ID. Current function:

function teste(){
            var id = $(this).parent().find('td').attr('id');
            alert(**enderecos**[1].**teste**);
            }

Function to recover data on screen:

 function atualiza(){
                $.ajax({    
                    dataType: 'json',
                    url: 'get_enderecos.php',
                    success: function(data){
                        for(var i=0; data.length>i;i++){
                            $('#enderecos').append('<tr><td id="teste">'+data[i].sequencia+'</td>'+
                                                    '<td>'+data[i].cep+'</td>'+
                                                    '<td>'+data[i].endereco+'</td>'+
                                                    '<td>'+data[i].bairro+'</td>'+
                                                    '<td>'+data[i].cidade+'</td>'+
                                                    '<td>'+data[i].estado+'</td>'+
                                                    '<td class="actions col-xs-2 col-sm-2 col-md-2 col-lg-2" align="center">'+
                                                        '<button class="btn btn-danger" onClick="teste()" type="button">Alterar Endereço</button>'+
                                                     '</td></tr>');

                            }
                        }
                    });

                }

TESTE is the id of the cell you want to search for ? But remember that you cannot have repeated id’s on a page

– Isac

2017/10/26 at 02:40
What value you are sending to the function teste()? If you don’t send anything, it’s impossible to do what you want.

– Sam

2017/10/26 at 02:48
Put the part of the code where you print this data on the screen. (It should be a while or json, whatever it is)

– Milrak Pereira Pessoa

2017/10/26 at 03:32
in the test function, if I give an Alert(.cep addresses) it returns to me an indefined.

– leonardo barussi

2017/10/26 at 07:42
Yes, testing is the cell ID I want to get

– leonardo barussi

2017/10/26 at 07:44
<tr><td id="teste"> -> this creates several lines with the same id which is incorrect at html level See here in the W3C documentation how ids have to be unique

– Isac

2017/10/26 at 09:35

Show 1 more comment

1 answer

Browser other questions tagged php jquery html css bootstrap-3

You are not signed in. Login or sign up in order to post.

by Isac • **24,736** points · Answer 1 · 2017-10-26T09:51:43+00:00

I start by indicating that the id you’re putting in the first <td> line is not correct as it will generate several lines with ids repeated. In html the attribute id has to be unique on the page.

Citing the W3C documentation:

The value must be Unique amongst all the Ids

Translating:

Value must be unique among all Ids

To fix this problem you can turn it into a class by changing the append for:

$('#enderecos').append('<tr><td class="teste">'+data[i].sequencia+'</td>'+ ...
//--------------------------------^ agora class

With this change already html is right and to fetch this <td> in the click can do so:

$("body").on( "click", ".actions .btn.btn-danger", function() {
    let htmlTeste = $(this).closest("tr").find(".teste").html();
});

Notice that I used the function on jquery to use delegation and ensure that the click works even on elements that are added to the page in the future.

With the function closest goes to the <tr> above and with the find descends again to the <td> with class teste.