Solution 1 :

Here is the jsFiddle link which you can refer for your solution.

$("#queryBtn").on('click', function(){
	let val = $("#inputTextArea").val();
  if(val){
  	const chunk = 5;
  	let valuesArray = val.toLowerCase().split(/[s*n*]/ig).filter((x) => x != "");
    console.log(valuesArray);
    let i,j,tArr;
    for (i=0,j=valuesArray.length; i<j; i+=chunk) {
        tArr = valuesArray.slice(i,i+chunk);
        window.open("https://www.google.com/search?q=" + tArr.join("+"));
    }
  }
});
<script src="https://code.jquery.com/jquery-3.4.1.slim.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.css" rel="stylesheet"/>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.js"></script>
<div class="container">
  <h5>
  Enter values in textarea
  </h5>
  <textarea id="inputTextArea" class="form-control" aria-label="With textarea"></textarea>
  <br>
  <button type="button" id="queryBtn" class="btn btn-primary">Send</button>
</div>

Try the fiddle link in order for the window.open to work ===> JS-Fiddle Link

to explain the code line by line –

  1. First took the value from text area using jquery id selector.

  2. Set the chunk to be equal to 5 (Since you have 5 as the chunk size).

  3. From text area we got string, so converted the string to lowercase and then using regular expression, we tried to split by space and new line characters. Then pipe lining it to the filter function which removes the unnecessary empty string jargon inside the array.

  4. Loop which is chunk wise, so splicing the array chunk wise and then joining it with ‘+’ character which is then passed to window.open.

Play around with the code and welcome to stack overflow 🙂

Make sure to up-vote if it solved your problem.

Solution 2 :

$(function() {
  $("#text1").click(function() {
    if ($("#textbox1").val() != "") {
      var search_container1 = $("#textbox1").val().replace(/s+/g, "+");
      var search_container1 = search_container1.split("+"),
        len = search_container1.length;

      var search_val1234 = [];
      for (var i = 0, j = -1; i < len; i++) {
        if (i % 5 == 0) {
          search_val1234[++j] = "";
        }
        search_val1234[j] += search_container1[i] + "+";
      }

      for (var i = 0; i < search_val1234.length; i++)
        window.open("https://www.google.com/search?client=firefox-b-d&q=" + search_val1234[i]);

    } else if ($("#textbox1").val() == "") alert("Enter Keyword");
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="textbox1" />
<button id="text1">Search</button>

Problem :

Need a small help.

The below script picks the value from the textbox and add it to the URL.

Example:

Text Box value:

one

two

three

Four

Five

Six

Seven

Output URL:

https://www.google.com/search?q=one+two+three+four+five+six+seven

The help I need:

Instead of adding all the text box values to the URL, i need the text box values to be split into multiples of 5 and split the URL accordingly

The output should be:

https://www.google.com/search?q=one+two+three+four+five

https://www.google.com/search?q=six+seven

$(function () {
  $("#text1").click(function () {
    if ($('#textbox1').val() != '') {
      var search_container1 = $("#textbox1").val().split(" ");
      for (k = 0; k < search_container1.length; k++) {
        search_container1[k] = search_container1[k].replace(/s/gi, "+");
      }
      var srcbox1 = "val1234";

      if (srcbox1 == "val1234") {
        var search_val1234 = "";
        for (var i = 0; i < search_container1.length; i++) {
          search_val1234 = search_container1[i];
          {
            window.open("https://www.google.com/search?client=firefox-b-d&q=" + search_val1234 + "");
          }
        }

      }
    }
    else if ($('#textbox1').val() == '') {
      alert("Enter Keyword");
    }
  });
});

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <title>textbox</title>
</head> 

<body>  
    <div class="container">

        <div class="col-sm">
                      <div class="card">
                      <div class="card-body"><center><a>Deal IDs</a></center>
                        <br>
                              <textarea id="textbox1" cols="5" rows="7"></textarea><br>
                        <center><br><button id="text1" class="btn btn-warning btn-block ">Submit</button></center>
                        </div>
                    </div>
                   </div>
    </div>


</body>

</html>

Comments

Comment posted by gaspar

it would be easier to answer with a working solution if you added the html part – you can also add the entire code as a working JavaScript snippet

Comment posted by Mathew

HTML part added

Comment posted by Rush W.

Hello.. @CFMathew Great.. Awesome.. 🙂

By

Leave a Reply

Your email address will not be published. Required fields are marked *