Solution 1 :

You basically need to repeat what you are doing for all textareas, so you can have something like this:

function generateTable() {

    $('textarea').each(function(){

      var data = $(this).val(); console.log(data);
      var rows = data.split("n");
      var table = $('<table />');

        for(var y in rows) {
            var cells = rows[y].split("t");
            var row = $('<tr />');
            for(var x in cells) {
                row.append('<td>'+cells[x]+'</td>');
            }
            table.append(row);
        }   

        $('#excel_table1').append(table);    
    })
}

Solution 2 :

you should process in a different way.
For example :
1. loop on each text element (it is very simple with jQuery)
– get the content
– add the content in a rows ( tag)
2. build the final table and add where you want.

You can try this script :

<script>

var rows = "", table = "";
$("textarea").each(function (){
    rows += "<tr><td>"+$(this).val()+"</td></tr>";
});
table = "<table>"+rows+"</table>";
$('#excel_table1').html(table);

</script>

Problem :

I want to generate a (unique) table from multiple text areas. The Idea is to fill the 1st column from the 1st text area, the 2nd column from the 2nd text area and the same for the third one (but in the end, all the data needs to be part of the same table (in different rows).

Tried this script:

<script>
function generateTable() {
    var data = $('textarea[name=excel_data1]').val(); console.log(data);
    var rows = data.split("n");
    var table = $('<table />');

for(var y in rows) {
    var cells = rows[y].split("t");
    var row = $('<tr />');
    for(var x in cells) {
        row.append('<td>'+cells[x]+'</td>');
    }
    table.append(row);
}

$('#excel_table1').html(table);
}
</script>

That’s my “body” with the text areas in divs:

  <div id=references>   <p>FI/ND:</p>
<textarea name="excel_data1" style="width:100px;height:20px;"></textarea> 
         </div>

  <div id=adresses>   <p>Adresses:</p>  
<textarea name="excel_data2" style="width:200px;height:20px;"></textarea>
         </div>

  <div id=more>   <p>(more:)</p>  
<textarea name="excel_data3" style="width:100px;height:20px;"></textarea>
         </div>
      <br>
<input id=bouton1 type="button" onclick="javascript:generateTable()" value="generate table"/>

And that’s the table generated in a different body:

<p>Table:</p>
   <div id="excel_table1"></div>

</center></body>

It works perfectly from one text area but I can’t make it work from multiple text areas.

Can Anyone help? thanks in advance 🙂

(sorry, I’m not an native English speaker)

P.S.: Tried copying the script twice, only changing the name of the textareas, but then the first textarea stop working:

<script>       
  function generateTable() {

    $('textarea[name=excel_data1]').each(function(){

      var data = $(this).val(); console.log(data);
      var rows = data.split("n");
      var table = $('<table />');

        for(var y in rows) {
            var cells = rows[y].split("t");
            var row = $('<tr />');
            for(var x in cells) {
                row.append('<td>'+cells[x]+'</td>');
            }
            table.append(row);
        }
        $('#excel_table1').html(table);

    })

}

function generateTable() {

    $('textarea[name=excel_data2]').each(function(){

      var data = $(this).val(); console.log(data);
      var rows = data.split("n");
      var table = $('<table />');

        for(var y in rows) {
            var cells = rows[y].split("t");
            var row = $('<tr />');
            for(var x in cells) {
                row.append('<td>'+cells[x]+'</td>');
            }
            table.append(row);
        }
        $('#excel_table1').html(table);

    })

}      
</script>

Comments

Comment posted by EnjoyLife

I tried that (copy/pasting your fonction twice, only changing the textarea name) but when I add the second text area, the first one stop working…

Comment posted by Anurag Srivastava

@EnjoyLifeJG You tried with

Comment posted by EnjoyLife

Yes, I tried only using $(‘textarea’), but then, only the 3rd textarea was working (excel_data3). I don’t get how am I supposed to “repeat what you are doing for all textareas” if I don’t specify each textarea name.

Comment posted by Anurag Srivastava

@EnjoyLifeJG Try with

Comment posted by EnjoyLife

Yes thank You, we’re getting closer ! 😀 Now, All the text areas are in the table, but all in the same column instead of getting Textarea1=1st column Textarea2=2nd Column

By