How to extract values from a column and separate them with a comma

Asked

Viewed 126 times

1

I’m trying to read a columna from a table and tap the results with a comma.

For example: I need the ID column. then the result would be: 31, 7, 6, 5, 4, 3, 2

I tried that way unsuccessfully.

    function table1Id() {


            for(var i = 1; i < table.length; i++)

                var col = table[i].cells[0].innerHTML + ', ';
               document.getElementById("idTable1").innerHTML = col;   
}
javascript

3 answers

1


In your case it would be better to create an array and then convert to string with .join(", "). Use document.querySelectorALL with the selector "#ID DA TABELA tr td:first-child" to take all cells from the first column of each row:

function table1Id() {
   var ids = []; // cria a array
   var tabela = document.querySelectorAll("#ID_DA_TABELA tr td:first-child");
   for(var i = 1; i < tabela.length; i++){
      ids.push(tabela[i].textContent.trim()); // adiciona o texto da coluna na array
   }
   document.getElementById("idTable1").innerHTML = ids.join(", ");
}

Where has ID_DA_TABELA you put the id of the table in question.

  • Hi Sam, there is something wrong with the suggested code, it locks everything. I tried consule.log() but nothing.

  • How you are declaring the variable table?

  • var table = Document.getElementById("table1"); I am yes . I also tried to create as Object instead of array. unsuccessfully. The.log console says: ids.Join is not a Function

  • Are you using Datatables?

  • The user creates this table directly on the clientside page.

  • @user2916405 If it’s a simple table, I made a change to the answer that should work.

  • table variable is being treated as a list. What seems strange to me. Try to replace with var table = document.getElementById('idTable1').rows

  • But it is good to debug it from there. You need to know which object each variable represents within the function. Puts some breakpoints.

  • It did work thanks. Thanks for the suggestion to debug. Figure out how to do it. Thanks again. You rock!

Show 4 more comments

0

Good morning

Try the following code:

<script>

function extractTableData() {
var myTab = document.querySelectorAll('#idTable1 tbody tr ');
var strResult='';
Array.from(myTab).forEach(input => {
  var tds = input.closest('tr').children;
  var obj = {};
  obj.A = tds[0].textContent;
  obj.B = tds[1].textContent;
  strResult=strResult+obj.A+',';  
});
console.log('Result=' + strResult);
}
</script>
<table id="idTable1">
<tr>
<td>31</td><td>15/09/2019</td>
</tr>
<tr>
<td>7</td><td>04/09/2019</td>
</tr>
<tr>
<td>6</td><td>04/09/2019</td>
</tr>
<tr>
<td>5</td><td>04/09/2019</td>
</tr>
<tr>
<td>4</td><td>03/09/2019</td>
</tr>
<tr>
<td>3</td><td>03/09/2019</td>
</tr>
<tr>
<td>2</td><td>03/09/2019</td>
</tr>
</table>
<div id="saida">
</div>

<a href="javascript:extractTableData();">execute</a>

Of course then convert to a function that returns as you wish the string. I am simply uniting the elements with + ',' to illustrate, but there are other better and more efficient ways.

But I believe it’s didactic for understanding extraction and unification.

I used as reference the example cited here: https://stackoverflow.com/questions/58885904/javascript-read-table-and-if-value-null-get-rows-data

Success!

-1

  • Unfortunately in this case I am not using Mysql database, so I need to do it directly in userside. But thanks for the info.

  • As you had not informed which database you were using, I responded by imagining that it could be Mysql. It would be better to do it in the bank than by code.

  • Yes, I fully agree with you. But in this case user creates the whole table directly in the client side and then is sent to a google spreadsheet.

Browser other questions tagged javascript

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