0

Gostaria de pegar o valor de uma coluna da tabela, mas de uma forma que eu pudesse reutilizar a função para pegar valores em outra tabelas.

Tentei da seguinte forma, mas ele não me apresenta nada no console.

OBS: O valor referente a linha somente.

HTML

<table class="table">
    <thead></thead>
    <tbody class="table-hover">
        <tr>
          <td id="id">2</td><td>Cliente N - 1</td>
          <td>teste</td>
          <td>2017-02-14 22:00:52</td>
          <td class="txt-center pointer"><span class="glyphicon glyphicon-ok txt-error pointer" onclick="updateStatus()"></span></td>
        </tr>
        <tr>
          <td id="id">3</td>
          <td>Cliente N - 2</td>
          <td>teste</td>
          <td>2017-02-14 22:00:52</td>
          <td class="txt-center pointer"><span class="glyphicon glyphicon-ok txt-error pointer" onclick="updateStatus()"></span></td>
        </tr>
    </tbody>
  <tfoot></tfoot>

jQuery

function updateStatus(param){ //param seria o numero da coluna
  var teste  = $('table > tbody').closest('tr').find('td').eq(param).text();
  console.log(teste);
}

então através do param eu indicaria a coluna a ser pega o valor...

6
  • Você precisa de uma linha específica ou de todas elas?
    – Woss
    Commented 23/02/2017 às 0:27
  • Desculpe, irei completar a pergunta. Commented 23/02/2017 às 0:28
  • "A linha" seria apenas a primeira linha ou a segunda?
    – Woss
    Commented 23/02/2017 às 0:32
  • No caso eu clicaria no span onde esta a função e entao naquela linha ele iria pegar o valor da coluna, a coluna iria ser passada atraves do param, por exemplo na coluna 3 onde está a data, o param iria indicar a coluna onde esta a coluna q contem data. Commented 23/02/2017 às 0:36
  • Desculpe-me, não vi que havia a chamada da função no span.
    – Woss
    Commented 23/02/2017 às 0:48

1 Resposta 1

2

Primeiro, adicione um parâmetro à função que fará referência ao span onde está chamando a função. Eu chamei o parâmetro de obj. Na chamada, adicione o valor this para este parâmetro. No segundo parâmetro, param, passe o número da coluna que deseja buscar. No exemplo abaixo, utilizei 1, então buscará os valores da primeira coluna, 2 e 3, dependendo da linha.

Para acessar o valor pelo jQuery, buscamos a tag tr no qual o span se encontra:

$(obj).parents("tr")

Após, buscamos a n-ésima tag td filha, em que o valor de n é definido pelo valor de param:

$(obj).parents("tr").find("td:nth-child(" + param + ")");

Com isso, podemos chamar o a função html para obter o valor da coluna:

console.log(column.html());

Veja abaixo funcionando:

function updateStatus(obj, param) {
  var column = $(obj).parents("tr").find("td:nth-child(" + param + ")");
  console.log(column.html());
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table class="table" border="1">
  <thead></thead>
  <tbody class="table-hover">
    <tr>
      <td id="id">2</td>
      <td>Cliente N - 1</td>
      <td>teste</td>
      <td>2017-02-14 22:00:52</td>
      <td class="txt-center pointer">
        <span class="glyphicon glyphicon-ok txt-error pointer" onclick="updateStatus(this, 1)">
          Icon
        </span>
      </td>
    </tr>
    <tr>
      <td id="id">3</td>
      <td>Cliente N - 2</td>
      <td>teste</td>
      <td>2017-02-14 22:00:52</td>
      <td class="txt-center pointer">
        <span class="glyphicon glyphicon-ok txt-error pointer" onclick="updateStatus(this, 1)">
          Icon
        </span>
      </td>
    </tr>
  </tbody>
  <tfoot></tfoot>
</table>

1
  • boa alem do código vc explicou, vou estudar seu código e implementa-lo em meu projeto, mt obrigado Commented 23/02/2017 às 1:56

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .