Fala galera !
Tenho uma requisição Ajax que utilizar o método post que busca todas as solicitações de acesso de um sistema do banco e retorna em uma tabela HTML no front.
Ao clicar em aceitar um usuário sempre pego o primeiro valor da tabela, mas queria que pegasse o usuário que realizei o click.
Minha dúvida é: Por se tratar de uma tabela dinâmica, como consigo clicar na TD, acessar o pai TR e posteriormente ir no primeiro TD do pai que possui o ID para fazer select no banco ?
Segue código da requisição AJAX:
$(document).ready(listaUsuarios)
function listaUsuarios() {
$.ajax({
type: 'POST',
url: 'http://localhost:3000/listar',
dataType: 'json',
success: function (data) {
qtd = data.success.length
for (var x = 0; qtd > x; x++) {
$('#resultado').append(`
<tr id='${data.success[x].id}'>
<td>${data.success[x].id}</td>
<td>${data.success[x].nome}</td>
<td>${data.success[x].setor}</td>
<td>${data.success[x].autorizado}</td>
<td onclick='aceito()' style='cursor:pointer'>${data.success[x].aceitar}</td>
<td onclick='recusou()' style='cursor:pointer'>${data.success[x].recusar}</td>
<td style='cursor:pointer'><img src='/icons/pencil.svg' style='margin-left:10px'
onclick='editar()' data-toggle="modal" data-target=".bd-example-modal-lg"></td>
</tr>`)
}
}
})
}
Eu fiz um código que conseguiu pegar o valor, porém o mesmo "acumular os clicks e acaba dando bug no html. Segue abaixo:
function aceito() {
let tr = document.querySelectorAll('tr')
tr.forEach(function (trs) {
trs.addEventListener('click', function () {
let id = trs.children[0]
$.ajax({
type: 'post',
url: 'http://localhost:3000/aceitaUsuario',
dataType: 'json',
data: {
id: id.innerText
},
success: function (data) {
if (data.success == 'ok') {
let campo = trs.children[4]
let campo2 = trs.children[5]
campo.innerText = 'Ok'
campo2.innerText = 'Excluir'
} else {
}
}
})
})
})
}
Código do Back end:
app.post('/aceitaUsuario', function (req, res) {
let id = req.body.id
let busca = `SELECT id=${id} FROM login;`
conexao.query(busca, function (erro, resultado) {
if (erro) {
console.log(erro)
} else {
if (resultado.length >= 1) {
let up = `UPDATE login SET acesso='Autorizado', aceitar='Ok' , recusar='Excluir' WHERE id='${id}';`
conexao.query(up, function (erro, resultado) {
if (erro) {
console.log(erro)
} else {
res.json({ success: 'ok' })
}
})
}
}
})
})
Se alguém conseguir ajudar vou ficar muito agradecido ! Valeu !!!