6
respostas

Selecionar uma unica linha da tabela no exercico da Aparecida.

como selecionar um único paciente da relação de pacientes constantes no exercicio da Aparecida. Por exemlo colocar mais uma coluna com um icone em cada linha, que quando clicasse nele fosse exibido os dados daquele paciente daquela linha.

6 respostas

Boa noite, Leandro! Como vai?

Se vc utilizar document.querySelector('.paciente') será selecionado apenas o primeiro paciente da tabela. Ou seja, um único paciente justamente como vc queria. Mas aí a forma como se seleciona esse tal único paciente que vc deseja vai depender do que vc quer fazer. Sendo assim, diz aí, o que vc gostaria de fazer de forma objetiva? Assim ficará mais fácil de tentar te ajudar.

Qualquer coisa é só falar!

Grande abraço e bons estudos, meu aluno!

Eu quero mostrar as informações do paciente na tela. O problemas é que eu consegui dar um addEventListener e deixar cada linha ouvindo se alguem clicar nela. També consegui fazer aparecer uma mensagem informando que houve um clique naquela linha. Mas ao tentar pegar os dados como o ID do paciente ela mostra somente o ID da ultima linha, independente da linha que é clicada.

Opa, Leandro!

Vc poderia colar aqui o seu código completo? Assim ficará melhor de te ajudar.

Observação importante: Quando for postar o código, utilize o botão "inserir código" e cole-o no lugar indicado pra que ele seja postado com a formatação correta.

Qualquer coisa é só falar!

Grande abraço e bons estudos, meu aluno!

Já consegui fazer mostrar o conteúdo da linha clicada, esta OK. É que eu estou usando uma outra rotina que tenho, de uma table onde é mostrado registros pegos de uma table Mysql. Estou criando uma rotina para abrir uma nova linha na tabela, para digitar os dados na própria tabela e depois salvar os dados digitados. Ja consegui abrir a nova linha na tabela, consigo digitar, só não estou conseguindo pegar os dados digitados na linha para salvar no banco.

//ROTINA PARA INCLUIR LINHA DE INPUT NA TABELA

  //Pega o botao que inclui novo registro
var botaoAdicionar = document.querySelector("#insere_registro");

   //coloca um escutador do evento click no botão de incluir
botaoAdicionar.addEventListener("click", function(event) {

    //inibe o comportamento normal do submit
    event.preventDefault();

    // cria uma linha TR para adicionar a tabela
    var registroTr = document.createElement("tr");

    // Processo de criação de cada TD com os respectivos inputs

    // cria uma td para o nome 
    var nomectd  = document.createElement("td");

    // cria o input para a TD nome
    var elemento_nome = document.createElement("input");
    elemento_nome.setAttribute("type", "text");
    elemento_nome.setAttribute("name", "nome_cli");
    elemento_nome.setAttribute("id", "noclitd");

    //adiciona os elementos do input a TD nome 
    nomectd.appendChild(elemento_nome);
    registroTr.appendChild(nomectd);

    // repete o processo para a tD serviço
    var servetd  = document.createElement("td");

    var elemento_servi = document.createElement("input");
    elemento_servi.setAttribute("type", "text");
    elemento_servi.setAttribute("name", "servico");
    elemento_servi.setAttribute("id", "servetd");

    servetd.appendChild(elemento_servi);
    registroTr.appendChild(servetd);

    // repete o processo para a TD classe CEP
    var clacetd  = document.createElement("td");

    var elemento_clac = document.createElement("input");
    elemento_clac.setAttribute("type", "text");
    elemento_clac.setAttribute("name", "clacep");
    elemento_clac.setAttribute("id", "clatd");

    clacetd.appendChild(elemento_clac);
    registroTr.appendChild(clacetd);

    // repete o processo para a TD valorcli
    var vlclitd  = document.createElement("td");

    var elemento_vcli = document.createElement("input");
    elemento_vcli.setAttribute("type", "text");
    elemento_vcli.setAttribute("name", "valorcli");
    elemento_vcli.setAttribute("id", "vclitd");

    vlclitd.appendChild(elemento_vcli);
    registroTr.appendChild(vlclitd);

    // repete o processo para a TD nome fornecedor
    var nofortd  = document.createElement("td");

    var elemento_nfor = document.createElement("input");
    elemento_nfor.setAttribute("type", "text");
    elemento_nfor.setAttribute("name", "nomefor");
    elemento_nfor.setAttribute("id", "nofortd");

    nofortd.appendChild(elemento_nfor);
    registroTr.appendChild(nofortd);

    // repete o processo para a TD valor fornecedor
    var vlfortd  = document.createElement("td");

    var elemento_vfor = document.createElement("input");
    elemento_vfor.setAttribute("type", "text");
    elemento_vfor.setAttribute("name", "valorfor");
    elemento_vfor.setAttribute("id", "vfortd");

    vlfortd.appendChild(elemento_vfor);
    registroTr.appendChild(vlfortd);

    // repete o processo para a TD Situaçõo
    var situatd  = document.createElement("td");

    var elemento_situ = document.createElement("input");
    elemento_situ.setAttribute("type", "text");
    elemento_situ.setAttribute("name", "situacao");
    elemento_situ.setAttribute("id", "situtd");

    situatd.appendChild(elemento_situ);
    registroTr.appendChild(situatd);

    /////////////////////////////////////////////////////////////////////

    var grava  = document.createElement("td");
    var botao = document.createElement("button");
    botao.setAttribute('type','button');
    botao.setAttribute('ID','alteratd');
    botao.setAttribute('class','glyphicon glyphicon-pencil text-primary');

    grava.appendChild(botao);
    registroTr.appendChild(grava);

    var deleta  = document.createElement("td");
    var botaod = document.createElement("button");
    botaod.setAttribute('type','button');
    botaod.setAttribute('ID','excluitd');
    botaod.setAttribute('class','glyphicon glyphicon-minus-sign text-danger');

    deleta.appendChild(botaod);
    registroTr.appendChild(deleta);
    /////////////////////////////////////////////////////////////////////

    //insere a nova linha com as respectivas celulas dentro da tabela.
    //appendChild - indere a linha no final da tabela
    // prepend - adiciona linha no inicio da tabela
    tabela_01.prepend(registroTr);

    var todasLinhas = document.querySelectorAll(".linhas");
    var nlinhas = todasLinhas.length;
    console.log(nlinhas);
    todasLinhas.forEach(function(mostraLinha) {
        mostraLinha.addEventListener("click", function(){
           console.log(mostraLinha);
        });
    }); 

});



Não estou conseguindo enviar o codigo HTML para você olhar junto com as rotinas javascrit. O codigo é muito grande (observação que aparece na tela ao tentar enviar).

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software