How to loop through every line in textarea?Transposing a 2D-array in JavaScriptHow do I detect a click outside an element?How can I upload files asynchronously?How do I check if an element is hidden in jQuery?How do I format a Microsoft JSON date?How to get the children of the $(this) selector?How do I redirect to another webpage?How to insert an item into an array at a specific index (JavaScript)?How can I know which radio button is selected via jQuery?How to check whether a checkbox is checked in jQuery?How can I refresh a page with jQuery?

In Star Trek IV, why did the Bounty go back to a time when whales were already rare?

Identify a stage play about a VR experience in which participants are encouraged to simulate performing horrific activities

Proof of Lemma: Every integer can be written as a product of primes

Indicating multiple different modes of speech (fantasy language or telepathy)

Can I create an upright 7-foot × 5-foot wall with the Minor Illusion spell?

Did US corporations pay demonstrators in the German demonstrations against article 13?

Are taller landing gear bad for aircraft, particulary large airliners?

Partial sums of primes

Lifted its hind leg on or lifted its hind leg towards?

A workplace installs custom certificates on personal devices, can this be used to decrypt HTTPS traffic?

Can I use my Chinese passport to enter China after I acquired another citizenship?

Is exact Kanji stroke length important?

Perfect riffle shuffles

What if somebody invests in my application?

Calculating the number of days between 2 dates in Excel

Can a malicious addon access internet history and such in chrome/firefox?

How to prevent YouTube from showing already watched videos?

Should my PhD thesis be submitted under my legal name?

Female=gender counterpart?

Meta programming: Declare a new struct on the fly

What is the term when two people sing in harmony, but they aren't singing the same notes?

Resetting two CD4017 counters simultaneously, only one resets

Stereotypical names

How to color a zone in Tikz



How to loop through every line in textarea?


Transposing a 2D-array in JavaScriptHow do I detect a click outside an element?How can I upload files asynchronously?How do I check if an element is hidden in jQuery?How do I format a Microsoft JSON date?How to get the children of the $(this) selector?How do I redirect to another webpage?How to insert an item into an array at a specific index (JavaScript)?How can I know which radio button is selected via jQuery?How to check whether a checkbox is checked in jQuery?How can I refresh a page with jQuery?













0















I am currently making a text combiner where you can choose a hypen that seperates the pieces of text. The problem with it is that I want every line to be separate.
For example if these are three separate columns:




1111 22222 333333

aaaaa bbbbb cccccc




I want it to output this:




1111-22222-33333

aaaaa-bbbbb-ccccc




But right now it would output something like:




11111

aaaaa-22222

bbbbb-33333

cccccc




This is because it loops through every textarea instead of every line. What is the best way to output it like the 2nd block of text?






$(document).ready(function() 
//add input field
var field_count = 0;
$('#add').click(function()
$('#get').show();
$('#combine').show();
field_count++;
$('table tr.tables').append('<td><textarea cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
);

//connect results with hyphen
$('#get').click(function()
$('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
return (this.value.length > 0) ? this.value : null;
).get().join($("input.combiner").val()));
);
);

<head>
<title>Column Combiner</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--<script type="text/javascript" src="assets/js/global.js"></script>
<link rel="stylesheet" href="assets/css/main.css">-->
</head>
<body>
<table>
<tr class="tables"></tr>
</table>
<form method="get">
<input id="add" type="button" value="Voeg veld toe">
<input class="combiner" id="combine" type="text" name="combiner">
<input id="get" type="button" value="Combineer">
<div id="values"></div>
</form>
</body>












share|improve this question
























  • where's the textarea -- I only see inputs

    – Yaakov5777
    Mar 8 at 8:26











  • It is added with the first jquery function

    – Codekonijn
    Mar 8 at 8:27











  • Im a little confused ith what ur trying to do, can you explain a little?

    – Yaakov5777
    Mar 8 at 8:34











  • i want to combine the text you put in the textareas. but it has to combine every line and put it in a list. right now it just combines the texareas with eachother

    – Codekonijn
    Mar 8 at 8:46















0















I am currently making a text combiner where you can choose a hypen that seperates the pieces of text. The problem with it is that I want every line to be separate.
For example if these are three separate columns:




1111 22222 333333

aaaaa bbbbb cccccc




I want it to output this:




1111-22222-33333

aaaaa-bbbbb-ccccc




But right now it would output something like:




11111

aaaaa-22222

bbbbb-33333

cccccc




This is because it loops through every textarea instead of every line. What is the best way to output it like the 2nd block of text?






$(document).ready(function() 
//add input field
var field_count = 0;
$('#add').click(function()
$('#get').show();
$('#combine').show();
field_count++;
$('table tr.tables').append('<td><textarea cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
);

//connect results with hyphen
$('#get').click(function()
$('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
return (this.value.length > 0) ? this.value : null;
).get().join($("input.combiner").val()));
);
);

<head>
<title>Column Combiner</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--<script type="text/javascript" src="assets/js/global.js"></script>
<link rel="stylesheet" href="assets/css/main.css">-->
</head>
<body>
<table>
<tr class="tables"></tr>
</table>
<form method="get">
<input id="add" type="button" value="Voeg veld toe">
<input class="combiner" id="combine" type="text" name="combiner">
<input id="get" type="button" value="Combineer">
<div id="values"></div>
</form>
</body>












share|improve this question
























  • where's the textarea -- I only see inputs

    – Yaakov5777
    Mar 8 at 8:26











  • It is added with the first jquery function

    – Codekonijn
    Mar 8 at 8:27











  • Im a little confused ith what ur trying to do, can you explain a little?

    – Yaakov5777
    Mar 8 at 8:34











  • i want to combine the text you put in the textareas. but it has to combine every line and put it in a list. right now it just combines the texareas with eachother

    – Codekonijn
    Mar 8 at 8:46













0












0








0








I am currently making a text combiner where you can choose a hypen that seperates the pieces of text. The problem with it is that I want every line to be separate.
For example if these are three separate columns:




1111 22222 333333

aaaaa bbbbb cccccc




I want it to output this:




1111-22222-33333

aaaaa-bbbbb-ccccc




But right now it would output something like:




11111

aaaaa-22222

bbbbb-33333

cccccc




This is because it loops through every textarea instead of every line. What is the best way to output it like the 2nd block of text?






$(document).ready(function() 
//add input field
var field_count = 0;
$('#add').click(function()
$('#get').show();
$('#combine').show();
field_count++;
$('table tr.tables').append('<td><textarea cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
);

//connect results with hyphen
$('#get').click(function()
$('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
return (this.value.length > 0) ? this.value : null;
).get().join($("input.combiner").val()));
);
);

<head>
<title>Column Combiner</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--<script type="text/javascript" src="assets/js/global.js"></script>
<link rel="stylesheet" href="assets/css/main.css">-->
</head>
<body>
<table>
<tr class="tables"></tr>
</table>
<form method="get">
<input id="add" type="button" value="Voeg veld toe">
<input class="combiner" id="combine" type="text" name="combiner">
<input id="get" type="button" value="Combineer">
<div id="values"></div>
</form>
</body>












share|improve this question
















I am currently making a text combiner where you can choose a hypen that seperates the pieces of text. The problem with it is that I want every line to be separate.
For example if these are three separate columns:




1111 22222 333333

aaaaa bbbbb cccccc




I want it to output this:




1111-22222-33333

aaaaa-bbbbb-ccccc




But right now it would output something like:




11111

aaaaa-22222

bbbbb-33333

cccccc




This is because it loops through every textarea instead of every line. What is the best way to output it like the 2nd block of text?






$(document).ready(function() 
//add input field
var field_count = 0;
$('#add').click(function()
$('#get').show();
$('#combine').show();
field_count++;
$('table tr.tables').append('<td><textarea cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
);

//connect results with hyphen
$('#get').click(function()
$('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
return (this.value.length > 0) ? this.value : null;
).get().join($("input.combiner").val()));
);
);

<head>
<title>Column Combiner</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--<script type="text/javascript" src="assets/js/global.js"></script>
<link rel="stylesheet" href="assets/css/main.css">-->
</head>
<body>
<table>
<tr class="tables"></tr>
</table>
<form method="get">
<input id="add" type="button" value="Voeg veld toe">
<input class="combiner" id="combine" type="text" name="combiner">
<input id="get" type="button" value="Combineer">
<div id="values"></div>
</form>
</body>








$(document).ready(function() 
//add input field
var field_count = 0;
$('#add').click(function()
$('#get').show();
$('#combine').show();
field_count++;
$('table tr.tables').append('<td><textarea cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
);

//connect results with hyphen
$('#get').click(function()
$('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
return (this.value.length > 0) ? this.value : null;
).get().join($("input.combiner").val()));
);
);

<head>
<title>Column Combiner</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--<script type="text/javascript" src="assets/js/global.js"></script>
<link rel="stylesheet" href="assets/css/main.css">-->
</head>
<body>
<table>
<tr class="tables"></tr>
</table>
<form method="get">
<input id="add" type="button" value="Voeg veld toe">
<input class="combiner" id="combine" type="text" name="combiner">
<input id="get" type="button" value="Combineer">
<div id="values"></div>
</form>
</body>





$(document).ready(function() 
//add input field
var field_count = 0;
$('#add').click(function()
$('#get').show();
$('#combine').show();
field_count++;
$('table tr.tables').append('<td><textarea cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
);

//connect results with hyphen
$('#get').click(function()
$('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
return (this.value.length > 0) ? this.value : null;
).get().join($("input.combiner").val()));
);
);

<head>
<title>Column Combiner</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--<script type="text/javascript" src="assets/js/global.js"></script>
<link rel="stylesheet" href="assets/css/main.css">-->
</head>
<body>
<table>
<tr class="tables"></tr>
</table>
<form method="get">
<input id="add" type="button" value="Voeg veld toe">
<input class="combiner" id="combine" type="text" name="combiner">
<input id="get" type="button" value="Combineer">
<div id="values"></div>
</form>
</body>






jquery






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Mar 8 at 8:30









TiiJ7

2,48711828




2,48711828










asked Mar 8 at 8:23









CodekonijnCodekonijn

72




72












  • where's the textarea -- I only see inputs

    – Yaakov5777
    Mar 8 at 8:26











  • It is added with the first jquery function

    – Codekonijn
    Mar 8 at 8:27











  • Im a little confused ith what ur trying to do, can you explain a little?

    – Yaakov5777
    Mar 8 at 8:34











  • i want to combine the text you put in the textareas. but it has to combine every line and put it in a list. right now it just combines the texareas with eachother

    – Codekonijn
    Mar 8 at 8:46

















  • where's the textarea -- I only see inputs

    – Yaakov5777
    Mar 8 at 8:26











  • It is added with the first jquery function

    – Codekonijn
    Mar 8 at 8:27











  • Im a little confused ith what ur trying to do, can you explain a little?

    – Yaakov5777
    Mar 8 at 8:34











  • i want to combine the text you put in the textareas. but it has to combine every line and put it in a list. right now it just combines the texareas with eachother

    – Codekonijn
    Mar 8 at 8:46
















where's the textarea -- I only see inputs

– Yaakov5777
Mar 8 at 8:26





where's the textarea -- I only see inputs

– Yaakov5777
Mar 8 at 8:26













It is added with the first jquery function

– Codekonijn
Mar 8 at 8:27





It is added with the first jquery function

– Codekonijn
Mar 8 at 8:27













Im a little confused ith what ur trying to do, can you explain a little?

– Yaakov5777
Mar 8 at 8:34





Im a little confused ith what ur trying to do, can you explain a little?

– Yaakov5777
Mar 8 at 8:34













i want to combine the text you put in the textareas. but it has to combine every line and put it in a list. right now it just combines the texareas with eachother

– Codekonijn
Mar 8 at 8:46





i want to combine the text you put in the textareas. but it has to combine every line and put it in a list. right now it just combines the texareas with eachother

– Codekonijn
Mar 8 at 8:46












3 Answers
3






active

oldest

votes


















1














This should do what you want. It reads each textarea, splits them to an array of rows, then merges the row values with the combiner. I added some more comments in the code.



(note: I also added a class on the input textareas, so it won't use the value of the output textarea)






$(document).ready(function() 
//add input field
var field_count = 0;
$('#add').click(function()
$('#get').show();
$('#combine').show();
field_count++;
$('table tr.tables').append('<td><textarea class="inputfield" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
);

var getCombinedValues = function()
var lines = [];

// split each text field to an array of lines, add that array to the global one
// [["111","aaa"],["222","bbb"],["333","ccc"]]
$('.inputfield').each(function()
lines.push($(this).val().split('n'));
);

// we now switch rows <-> colums since we want to join the same line in each textarea, rather than all lines per textarea, eg.
// [["111","222","333"],["aaa","bbb","ccc"]]
// (solution from https://stackoverflow.com/a/41772644/3178068)
lines = lines.reduce((prev, next) => next.map((item, i) =>
(prev[i] ;

//connect results with hyphen
$('#get').click(function()
$('#values').html('<textarea cols="40" rows="15">' + getCombinedValues() + '</textarea>');
);
);

<head>
<title>Column Combiner</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--<script type="text/javascript" src="assets/js/global.js"></script>
<link rel="stylesheet" href="assets/css/main.css">-->
</head>
<body>
<table>
<tr class="tables"></tr>
</table>
<form method="get">
<input id="add" type="button" value="Voeg veld toe (Add input field)">
<input class="combiner" id="combine" type="text" name="combiner">
<input id="get" type="button" value="Combineer (Combine)">
<div id="values"></div>
</form>
</body>








share|improve this answer






























    0














    It is not very clear what you want to do. But if you want to loop all the rows you can do this



    var rows = $('#tname').val().split(/r?n/);

    for (var i = 0; i < rows.length; i++)
    console.log(rows[i]);



    But it seems your desired output can also be reached just by replacing spaces with a dash



    $('#tname').val($('#tname').val().replace(/ /g, '-'));





    share|improve this answer






























      0














      I think this is what you are trying to get: Value in each line of textarea.






      function readvalues() 
      $('textarea').each((index, elem) =>
      var lines = $(elem).val().split('n');
      for(var i = 0;i < lines.length;i++)
      console.log(`textarea-$index + 1`, lines[i]);

      );


      $(document).ready(function()
      //add input field
      var field_count = 0;
      $('#add').click(function()
      $('#get').show();
      $('#combine').show();
      field_count++;
      $('table tr.tables').append('<td><textarea onchange="readvalues();" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
      );

      //connect results with hyphen
      $('#get').click(function()
      $('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
      return (this.value.length > 0) ? this.value : null;
      ).get().join($("input.combiner").val()));
      );
      );

      <head>
      <title>Column Combiner</title>
      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <!--<script type="text/javascript" src="assets/js/global.js"></script>
      <link rel="stylesheet" href="assets/css/main.css">-->
      </head>
      <body>
      <table>
      <tr class="tables"></tr>
      </table>
      <form method="get">
      <input id="add" type="button" value="Voeg veld toe">
      <input class="combiner" id="combine" type="text" name="combiner">
      <input id="get" type="button" value="Combineer">
      <div id="values"></div>
      </form>
      </body>








      share|improve this answer

























      • this outputs as textarea--textarea--textarea again but i want it to ouput like textarea1line1-textarea2line1-textarea3line1, i hope this makes sense

        – Codekonijn
        Mar 8 at 8:54











      • @Codekonijn, I have edited my answer, the above code will get you, textarea1-line1, textarea2-line2 and henceforth.

        – Avanthika
        Mar 8 at 9:50










      Your Answer






      StackExchange.ifUsing("editor", function ()
      StackExchange.using("externalEditor", function ()
      StackExchange.using("snippets", function ()
      StackExchange.snippets.init();
      );
      );
      , "code-snippets");

      StackExchange.ready(function()
      var channelOptions =
      tags: "".split(" "),
      id: "1"
      ;
      initTagRenderer("".split(" "), "".split(" "), channelOptions);

      StackExchange.using("externalEditor", function()
      // Have to fire editor after snippets, if snippets enabled
      if (StackExchange.settings.snippets.snippetsEnabled)
      StackExchange.using("snippets", function()
      createEditor();
      );

      else
      createEditor();

      );

      function createEditor()
      StackExchange.prepareEditor(
      heartbeatType: 'answer',
      autoActivateHeartbeat: false,
      convertImagesToLinks: true,
      noModals: true,
      showLowRepImageUploadWarning: true,
      reputationToPostImages: 10,
      bindNavPrevention: true,
      postfix: "",
      imageUploader:
      brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
      contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
      allowUrls: true
      ,
      onDemand: true,
      discardSelector: ".discard-answer"
      ,immediatelyShowMarkdownHelp:true
      );



      );













      draft saved

      draft discarded


















      StackExchange.ready(
      function ()
      StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55059247%2fhow-to-loop-through-every-line-in-textarea%23new-answer', 'question_page');

      );

      Post as a guest















      Required, but never shown

























      3 Answers
      3






      active

      oldest

      votes








      3 Answers
      3






      active

      oldest

      votes









      active

      oldest

      votes






      active

      oldest

      votes









      1














      This should do what you want. It reads each textarea, splits them to an array of rows, then merges the row values with the combiner. I added some more comments in the code.



      (note: I also added a class on the input textareas, so it won't use the value of the output textarea)






      $(document).ready(function() 
      //add input field
      var field_count = 0;
      $('#add').click(function()
      $('#get').show();
      $('#combine').show();
      field_count++;
      $('table tr.tables').append('<td><textarea class="inputfield" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
      );

      var getCombinedValues = function()
      var lines = [];

      // split each text field to an array of lines, add that array to the global one
      // [["111","aaa"],["222","bbb"],["333","ccc"]]
      $('.inputfield').each(function()
      lines.push($(this).val().split('n'));
      );

      // we now switch rows <-> colums since we want to join the same line in each textarea, rather than all lines per textarea, eg.
      // [["111","222","333"],["aaa","bbb","ccc"]]
      // (solution from https://stackoverflow.com/a/41772644/3178068)
      lines = lines.reduce((prev, next) => next.map((item, i) =>
      (prev[i] ;

      //connect results with hyphen
      $('#get').click(function()
      $('#values').html('<textarea cols="40" rows="15">' + getCombinedValues() + '</textarea>');
      );
      );

      <head>
      <title>Column Combiner</title>
      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <!--<script type="text/javascript" src="assets/js/global.js"></script>
      <link rel="stylesheet" href="assets/css/main.css">-->
      </head>
      <body>
      <table>
      <tr class="tables"></tr>
      </table>
      <form method="get">
      <input id="add" type="button" value="Voeg veld toe (Add input field)">
      <input class="combiner" id="combine" type="text" name="combiner">
      <input id="get" type="button" value="Combineer (Combine)">
      <div id="values"></div>
      </form>
      </body>








      share|improve this answer



























        1














        This should do what you want. It reads each textarea, splits them to an array of rows, then merges the row values with the combiner. I added some more comments in the code.



        (note: I also added a class on the input textareas, so it won't use the value of the output textarea)






        $(document).ready(function() 
        //add input field
        var field_count = 0;
        $('#add').click(function()
        $('#get').show();
        $('#combine').show();
        field_count++;
        $('table tr.tables').append('<td><textarea class="inputfield" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
        );

        var getCombinedValues = function()
        var lines = [];

        // split each text field to an array of lines, add that array to the global one
        // [["111","aaa"],["222","bbb"],["333","ccc"]]
        $('.inputfield').each(function()
        lines.push($(this).val().split('n'));
        );

        // we now switch rows <-> colums since we want to join the same line in each textarea, rather than all lines per textarea, eg.
        // [["111","222","333"],["aaa","bbb","ccc"]]
        // (solution from https://stackoverflow.com/a/41772644/3178068)
        lines = lines.reduce((prev, next) => next.map((item, i) =>
        (prev[i] ;

        //connect results with hyphen
        $('#get').click(function()
        $('#values').html('<textarea cols="40" rows="15">' + getCombinedValues() + '</textarea>');
        );
        );

        <head>
        <title>Column Combiner</title>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <!--<script type="text/javascript" src="assets/js/global.js"></script>
        <link rel="stylesheet" href="assets/css/main.css">-->
        </head>
        <body>
        <table>
        <tr class="tables"></tr>
        </table>
        <form method="get">
        <input id="add" type="button" value="Voeg veld toe (Add input field)">
        <input class="combiner" id="combine" type="text" name="combiner">
        <input id="get" type="button" value="Combineer (Combine)">
        <div id="values"></div>
        </form>
        </body>








        share|improve this answer

























          1












          1








          1







          This should do what you want. It reads each textarea, splits them to an array of rows, then merges the row values with the combiner. I added some more comments in the code.



          (note: I also added a class on the input textareas, so it won't use the value of the output textarea)






          $(document).ready(function() 
          //add input field
          var field_count = 0;
          $('#add').click(function()
          $('#get').show();
          $('#combine').show();
          field_count++;
          $('table tr.tables').append('<td><textarea class="inputfield" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
          );

          var getCombinedValues = function()
          var lines = [];

          // split each text field to an array of lines, add that array to the global one
          // [["111","aaa"],["222","bbb"],["333","ccc"]]
          $('.inputfield').each(function()
          lines.push($(this).val().split('n'));
          );

          // we now switch rows <-> colums since we want to join the same line in each textarea, rather than all lines per textarea, eg.
          // [["111","222","333"],["aaa","bbb","ccc"]]
          // (solution from https://stackoverflow.com/a/41772644/3178068)
          lines = lines.reduce((prev, next) => next.map((item, i) =>
          (prev[i] ;

          //connect results with hyphen
          $('#get').click(function()
          $('#values').html('<textarea cols="40" rows="15">' + getCombinedValues() + '</textarea>');
          );
          );

          <head>
          <title>Column Combiner</title>
          <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
          <!--<script type="text/javascript" src="assets/js/global.js"></script>
          <link rel="stylesheet" href="assets/css/main.css">-->
          </head>
          <body>
          <table>
          <tr class="tables"></tr>
          </table>
          <form method="get">
          <input id="add" type="button" value="Voeg veld toe (Add input field)">
          <input class="combiner" id="combine" type="text" name="combiner">
          <input id="get" type="button" value="Combineer (Combine)">
          <div id="values"></div>
          </form>
          </body>








          share|improve this answer













          This should do what you want. It reads each textarea, splits them to an array of rows, then merges the row values with the combiner. I added some more comments in the code.



          (note: I also added a class on the input textareas, so it won't use the value of the output textarea)






          $(document).ready(function() 
          //add input field
          var field_count = 0;
          $('#add').click(function()
          $('#get').show();
          $('#combine').show();
          field_count++;
          $('table tr.tables').append('<td><textarea class="inputfield" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
          );

          var getCombinedValues = function()
          var lines = [];

          // split each text field to an array of lines, add that array to the global one
          // [["111","aaa"],["222","bbb"],["333","ccc"]]
          $('.inputfield').each(function()
          lines.push($(this).val().split('n'));
          );

          // we now switch rows <-> colums since we want to join the same line in each textarea, rather than all lines per textarea, eg.
          // [["111","222","333"],["aaa","bbb","ccc"]]
          // (solution from https://stackoverflow.com/a/41772644/3178068)
          lines = lines.reduce((prev, next) => next.map((item, i) =>
          (prev[i] ;

          //connect results with hyphen
          $('#get').click(function()
          $('#values').html('<textarea cols="40" rows="15">' + getCombinedValues() + '</textarea>');
          );
          );

          <head>
          <title>Column Combiner</title>
          <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
          <!--<script type="text/javascript" src="assets/js/global.js"></script>
          <link rel="stylesheet" href="assets/css/main.css">-->
          </head>
          <body>
          <table>
          <tr class="tables"></tr>
          </table>
          <form method="get">
          <input id="add" type="button" value="Voeg veld toe (Add input field)">
          <input class="combiner" id="combine" type="text" name="combiner">
          <input id="get" type="button" value="Combineer (Combine)">
          <div id="values"></div>
          </form>
          </body>








          $(document).ready(function() 
          //add input field
          var field_count = 0;
          $('#add').click(function()
          $('#get').show();
          $('#combine').show();
          field_count++;
          $('table tr.tables').append('<td><textarea class="inputfield" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
          );

          var getCombinedValues = function()
          var lines = [];

          // split each text field to an array of lines, add that array to the global one
          // [["111","aaa"],["222","bbb"],["333","ccc"]]
          $('.inputfield').each(function()
          lines.push($(this).val().split('n'));
          );

          // we now switch rows <-> colums since we want to join the same line in each textarea, rather than all lines per textarea, eg.
          // [["111","222","333"],["aaa","bbb","ccc"]]
          // (solution from https://stackoverflow.com/a/41772644/3178068)
          lines = lines.reduce((prev, next) => next.map((item, i) =>
          (prev[i] ;

          //connect results with hyphen
          $('#get').click(function()
          $('#values').html('<textarea cols="40" rows="15">' + getCombinedValues() + '</textarea>');
          );
          );

          <head>
          <title>Column Combiner</title>
          <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
          <!--<script type="text/javascript" src="assets/js/global.js"></script>
          <link rel="stylesheet" href="assets/css/main.css">-->
          </head>
          <body>
          <table>
          <tr class="tables"></tr>
          </table>
          <form method="get">
          <input id="add" type="button" value="Voeg veld toe (Add input field)">
          <input class="combiner" id="combine" type="text" name="combiner">
          <input id="get" type="button" value="Combineer (Combine)">
          <div id="values"></div>
          </form>
          </body>





          $(document).ready(function() 
          //add input field
          var field_count = 0;
          $('#add').click(function()
          $('#get').show();
          $('#combine').show();
          field_count++;
          $('table tr.tables').append('<td><textarea class="inputfield" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
          );

          var getCombinedValues = function()
          var lines = [];

          // split each text field to an array of lines, add that array to the global one
          // [["111","aaa"],["222","bbb"],["333","ccc"]]
          $('.inputfield').each(function()
          lines.push($(this).val().split('n'));
          );

          // we now switch rows <-> colums since we want to join the same line in each textarea, rather than all lines per textarea, eg.
          // [["111","222","333"],["aaa","bbb","ccc"]]
          // (solution from https://stackoverflow.com/a/41772644/3178068)
          lines = lines.reduce((prev, next) => next.map((item, i) =>
          (prev[i] ;

          //connect results with hyphen
          $('#get').click(function()
          $('#values').html('<textarea cols="40" rows="15">' + getCombinedValues() + '</textarea>');
          );
          );

          <head>
          <title>Column Combiner</title>
          <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
          <!--<script type="text/javascript" src="assets/js/global.js"></script>
          <link rel="stylesheet" href="assets/css/main.css">-->
          </head>
          <body>
          <table>
          <tr class="tables"></tr>
          </table>
          <form method="get">
          <input id="add" type="button" value="Voeg veld toe (Add input field)">
          <input class="combiner" id="combine" type="text" name="combiner">
          <input id="get" type="button" value="Combineer (Combine)">
          <div id="values"></div>
          </form>
          </body>






          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Mar 8 at 9:50









          TiiJ7TiiJ7

          2,48711828




          2,48711828























              0














              It is not very clear what you want to do. But if you want to loop all the rows you can do this



              var rows = $('#tname').val().split(/r?n/);

              for (var i = 0; i < rows.length; i++)
              console.log(rows[i]);



              But it seems your desired output can also be reached just by replacing spaces with a dash



              $('#tname').val($('#tname').val().replace(/ /g, '-'));





              share|improve this answer



























                0














                It is not very clear what you want to do. But if you want to loop all the rows you can do this



                var rows = $('#tname').val().split(/r?n/);

                for (var i = 0; i < rows.length; i++)
                console.log(rows[i]);



                But it seems your desired output can also be reached just by replacing spaces with a dash



                $('#tname').val($('#tname').val().replace(/ /g, '-'));





                share|improve this answer

























                  0












                  0








                  0







                  It is not very clear what you want to do. But if you want to loop all the rows you can do this



                  var rows = $('#tname').val().split(/r?n/);

                  for (var i = 0; i < rows.length; i++)
                  console.log(rows[i]);



                  But it seems your desired output can also be reached just by replacing spaces with a dash



                  $('#tname').val($('#tname').val().replace(/ /g, '-'));





                  share|improve this answer













                  It is not very clear what you want to do. But if you want to loop all the rows you can do this



                  var rows = $('#tname').val().split(/r?n/);

                  for (var i = 0; i < rows.length; i++)
                  console.log(rows[i]);



                  But it seems your desired output can also be reached just by replacing spaces with a dash



                  $('#tname').val($('#tname').val().replace(/ /g, '-'));






                  share|improve this answer












                  share|improve this answer



                  share|improve this answer










                  answered Mar 8 at 8:42









                  VDWWDVDWWD

                  24.6k123856




                  24.6k123856





















                      0














                      I think this is what you are trying to get: Value in each line of textarea.






                      function readvalues() 
                      $('textarea').each((index, elem) =>
                      var lines = $(elem).val().split('n');
                      for(var i = 0;i < lines.length;i++)
                      console.log(`textarea-$index + 1`, lines[i]);

                      );


                      $(document).ready(function()
                      //add input field
                      var field_count = 0;
                      $('#add').click(function()
                      $('#get').show();
                      $('#combine').show();
                      field_count++;
                      $('table tr.tables').append('<td><textarea onchange="readvalues();" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
                      );

                      //connect results with hyphen
                      $('#get').click(function()
                      $('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
                      return (this.value.length > 0) ? this.value : null;
                      ).get().join($("input.combiner").val()));
                      );
                      );

                      <head>
                      <title>Column Combiner</title>
                      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                      <!--<script type="text/javascript" src="assets/js/global.js"></script>
                      <link rel="stylesheet" href="assets/css/main.css">-->
                      </head>
                      <body>
                      <table>
                      <tr class="tables"></tr>
                      </table>
                      <form method="get">
                      <input id="add" type="button" value="Voeg veld toe">
                      <input class="combiner" id="combine" type="text" name="combiner">
                      <input id="get" type="button" value="Combineer">
                      <div id="values"></div>
                      </form>
                      </body>








                      share|improve this answer

























                      • this outputs as textarea--textarea--textarea again but i want it to ouput like textarea1line1-textarea2line1-textarea3line1, i hope this makes sense

                        – Codekonijn
                        Mar 8 at 8:54











                      • @Codekonijn, I have edited my answer, the above code will get you, textarea1-line1, textarea2-line2 and henceforth.

                        – Avanthika
                        Mar 8 at 9:50















                      0














                      I think this is what you are trying to get: Value in each line of textarea.






                      function readvalues() 
                      $('textarea').each((index, elem) =>
                      var lines = $(elem).val().split('n');
                      for(var i = 0;i < lines.length;i++)
                      console.log(`textarea-$index + 1`, lines[i]);

                      );


                      $(document).ready(function()
                      //add input field
                      var field_count = 0;
                      $('#add').click(function()
                      $('#get').show();
                      $('#combine').show();
                      field_count++;
                      $('table tr.tables').append('<td><textarea onchange="readvalues();" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
                      );

                      //connect results with hyphen
                      $('#get').click(function()
                      $('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
                      return (this.value.length > 0) ? this.value : null;
                      ).get().join($("input.combiner").val()));
                      );
                      );

                      <head>
                      <title>Column Combiner</title>
                      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                      <!--<script type="text/javascript" src="assets/js/global.js"></script>
                      <link rel="stylesheet" href="assets/css/main.css">-->
                      </head>
                      <body>
                      <table>
                      <tr class="tables"></tr>
                      </table>
                      <form method="get">
                      <input id="add" type="button" value="Voeg veld toe">
                      <input class="combiner" id="combine" type="text" name="combiner">
                      <input id="get" type="button" value="Combineer">
                      <div id="values"></div>
                      </form>
                      </body>








                      share|improve this answer

























                      • this outputs as textarea--textarea--textarea again but i want it to ouput like textarea1line1-textarea2line1-textarea3line1, i hope this makes sense

                        – Codekonijn
                        Mar 8 at 8:54











                      • @Codekonijn, I have edited my answer, the above code will get you, textarea1-line1, textarea2-line2 and henceforth.

                        – Avanthika
                        Mar 8 at 9:50













                      0












                      0








                      0







                      I think this is what you are trying to get: Value in each line of textarea.






                      function readvalues() 
                      $('textarea').each((index, elem) =>
                      var lines = $(elem).val().split('n');
                      for(var i = 0;i < lines.length;i++)
                      console.log(`textarea-$index + 1`, lines[i]);

                      );


                      $(document).ready(function()
                      //add input field
                      var field_count = 0;
                      $('#add').click(function()
                      $('#get').show();
                      $('#combine').show();
                      field_count++;
                      $('table tr.tables').append('<td><textarea onchange="readvalues();" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
                      );

                      //connect results with hyphen
                      $('#get').click(function()
                      $('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
                      return (this.value.length > 0) ? this.value : null;
                      ).get().join($("input.combiner").val()));
                      );
                      );

                      <head>
                      <title>Column Combiner</title>
                      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                      <!--<script type="text/javascript" src="assets/js/global.js"></script>
                      <link rel="stylesheet" href="assets/css/main.css">-->
                      </head>
                      <body>
                      <table>
                      <tr class="tables"></tr>
                      </table>
                      <form method="get">
                      <input id="add" type="button" value="Voeg veld toe">
                      <input class="combiner" id="combine" type="text" name="combiner">
                      <input id="get" type="button" value="Combineer">
                      <div id="values"></div>
                      </form>
                      </body>








                      share|improve this answer















                      I think this is what you are trying to get: Value in each line of textarea.






                      function readvalues() 
                      $('textarea').each((index, elem) =>
                      var lines = $(elem).val().split('n');
                      for(var i = 0;i < lines.length;i++)
                      console.log(`textarea-$index + 1`, lines[i]);

                      );


                      $(document).ready(function()
                      //add input field
                      var field_count = 0;
                      $('#add').click(function()
                      $('#get').show();
                      $('#combine').show();
                      field_count++;
                      $('table tr.tables').append('<td><textarea onchange="readvalues();" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
                      );

                      //connect results with hyphen
                      $('#get').click(function()
                      $('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
                      return (this.value.length > 0) ? this.value : null;
                      ).get().join($("input.combiner").val()));
                      );
                      );

                      <head>
                      <title>Column Combiner</title>
                      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                      <!--<script type="text/javascript" src="assets/js/global.js"></script>
                      <link rel="stylesheet" href="assets/css/main.css">-->
                      </head>
                      <body>
                      <table>
                      <tr class="tables"></tr>
                      </table>
                      <form method="get">
                      <input id="add" type="button" value="Voeg veld toe">
                      <input class="combiner" id="combine" type="text" name="combiner">
                      <input id="get" type="button" value="Combineer">
                      <div id="values"></div>
                      </form>
                      </body>








                      function readvalues() 
                      $('textarea').each((index, elem) =>
                      var lines = $(elem).val().split('n');
                      for(var i = 0;i < lines.length;i++)
                      console.log(`textarea-$index + 1`, lines[i]);

                      );


                      $(document).ready(function()
                      //add input field
                      var field_count = 0;
                      $('#add').click(function()
                      $('#get').show();
                      $('#combine').show();
                      field_count++;
                      $('table tr.tables').append('<td><textarea onchange="readvalues();" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
                      );

                      //connect results with hyphen
                      $('#get').click(function()
                      $('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
                      return (this.value.length > 0) ? this.value : null;
                      ).get().join($("input.combiner").val()));
                      );
                      );

                      <head>
                      <title>Column Combiner</title>
                      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                      <!--<script type="text/javascript" src="assets/js/global.js"></script>
                      <link rel="stylesheet" href="assets/css/main.css">-->
                      </head>
                      <body>
                      <table>
                      <tr class="tables"></tr>
                      </table>
                      <form method="get">
                      <input id="add" type="button" value="Voeg veld toe">
                      <input class="combiner" id="combine" type="text" name="combiner">
                      <input id="get" type="button" value="Combineer">
                      <div id="values"></div>
                      </form>
                      </body>





                      function readvalues() 
                      $('textarea').each((index, elem) =>
                      var lines = $(elem).val().split('n');
                      for(var i = 0;i < lines.length;i++)
                      console.log(`textarea-$index + 1`, lines[i]);

                      );


                      $(document).ready(function()
                      //add input field
                      var field_count = 0;
                      $('#add').click(function()
                      $('#get').show();
                      $('#combine').show();
                      field_count++;
                      $('table tr.tables').append('<td><textarea onchange="readvalues();" cols="40" rows="15" name="tname' + field_count + '"></textarea></td>');
                      );

                      //connect results with hyphen
                      $('#get').click(function()
                      $('#values').html('<textarea cols="40" rows="15">' + $('textarea').map(function()
                      return (this.value.length > 0) ? this.value : null;
                      ).get().join($("input.combiner").val()));
                      );
                      );

                      <head>
                      <title>Column Combiner</title>
                      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                      <!--<script type="text/javascript" src="assets/js/global.js"></script>
                      <link rel="stylesheet" href="assets/css/main.css">-->
                      </head>
                      <body>
                      <table>
                      <tr class="tables"></tr>
                      </table>
                      <form method="get">
                      <input id="add" type="button" value="Voeg veld toe">
                      <input class="combiner" id="combine" type="text" name="combiner">
                      <input id="get" type="button" value="Combineer">
                      <div id="values"></div>
                      </form>
                      </body>






                      share|improve this answer














                      share|improve this answer



                      share|improve this answer








                      edited Mar 8 at 9:49

























                      answered Mar 8 at 8:45









                      AvanthikaAvanthika

                      1,050513




                      1,050513












                      • this outputs as textarea--textarea--textarea again but i want it to ouput like textarea1line1-textarea2line1-textarea3line1, i hope this makes sense

                        – Codekonijn
                        Mar 8 at 8:54











                      • @Codekonijn, I have edited my answer, the above code will get you, textarea1-line1, textarea2-line2 and henceforth.

                        – Avanthika
                        Mar 8 at 9:50

















                      • this outputs as textarea--textarea--textarea again but i want it to ouput like textarea1line1-textarea2line1-textarea3line1, i hope this makes sense

                        – Codekonijn
                        Mar 8 at 8:54











                      • @Codekonijn, I have edited my answer, the above code will get you, textarea1-line1, textarea2-line2 and henceforth.

                        – Avanthika
                        Mar 8 at 9:50
















                      this outputs as textarea--textarea--textarea again but i want it to ouput like textarea1line1-textarea2line1-textarea3line1, i hope this makes sense

                      – Codekonijn
                      Mar 8 at 8:54





                      this outputs as textarea--textarea--textarea again but i want it to ouput like textarea1line1-textarea2line1-textarea3line1, i hope this makes sense

                      – Codekonijn
                      Mar 8 at 8:54













                      @Codekonijn, I have edited my answer, the above code will get you, textarea1-line1, textarea2-line2 and henceforth.

                      – Avanthika
                      Mar 8 at 9:50





                      @Codekonijn, I have edited my answer, the above code will get you, textarea1-line1, textarea2-line2 and henceforth.

                      – Avanthika
                      Mar 8 at 9:50

















                      draft saved

                      draft discarded
















































                      Thanks for contributing an answer to Stack Overflow!


                      • Please be sure to answer the question. Provide details and share your research!

                      But avoid


                      • Asking for help, clarification, or responding to other answers.

                      • Making statements based on opinion; back them up with references or personal experience.

                      To learn more, see our tips on writing great answers.




                      draft saved


                      draft discarded














                      StackExchange.ready(
                      function ()
                      StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55059247%2fhow-to-loop-through-every-line-in-textarea%23new-answer', 'question_page');

                      );

                      Post as a guest















                      Required, but never shown





















































                      Required, but never shown














                      Required, but never shown












                      Required, but never shown







                      Required, but never shown

































                      Required, but never shown














                      Required, but never shown












                      Required, but never shown







                      Required, but never shown







                      Popular posts from this blog

                      Identity Server 4 is not redirecting to Angular app after login2019 Community Moderator ElectionIdentity Server 4 and dockerIdentityserver implicit flow unauthorized_clientIdentityServer Hybrid Flow - Access Token is null after user successful loginIdentity Server to MVC client : Page Redirect After loginLogin with Steam OpenId(oidc-client-js)Identity Server 4+.NET Core 2.0 + IdentityIdentityServer4 post-login redirect not working in Edge browserCall to IdentityServer4 generates System.NullReferenceException: Object reference not set to an instance of an objectIdentityServer4 without HTTPS not workingHow to get Authorization code from identity server without login form

                      2005 Ahvaz unrest Contents Background Causes Casualties Aftermath See also References Navigation menue"At Least 10 Are Killed by Bombs in Iran""Iran"Archived"Arab-Iranians in Iran to make April 15 'Day of Fury'"State of Mind, State of Order: Reactions to Ethnic Unrest in the Islamic Republic of Iran.10.1111/j.1754-9469.2008.00028.x"Iran hangs Arab separatists"Iran Overview from ArchivedConstitution of the Islamic Republic of Iran"Tehran puzzled by forged 'riots' letter""Iran and its minorities: Down in the second class""Iran: Handling Of Ahvaz Unrest Could End With Televised Confessions""Bombings Rock Iran Ahead of Election""Five die in Iran ethnic clashes""Iran: Need for restraint as anniversary of unrest in Khuzestan approaches"Archived"Iranian Sunni protesters killed in clashes with security forces"Archived

                      Can't initialize raids on a new ASUS Prime B360M-A motherboard2019 Community Moderator ElectionSimilar to RAID config yet more like mirroring solution?Can't get motherboard serial numberWhy does the BIOS entry point start with a WBINVD instruction?UEFI performance Asus Maximus V Extreme