Split string in Javascript across 2 fields

javascript split regex
javascript split string at index
javascript split string by comma
split array javascript
jquery split string to array
javascript join
javascript string replace
string split java

I have the following script that inserts the value of name into the hidden field first_name when I focus out the input field. Is it possible if I enter more than one name in the name field that everything after the space is moved to last_name?

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("input").focusout(function(){
        var first_name = $(this).val();
    	$('input#first_name').val(first_name);
    });
});
</script>
</head>
<body>

<div style="border: 1px solid black;padding:10px;">
  Name: <input id="name" name="name" autocomplete="off">
	<input type="hidden" id="first_name" name="first_name" autocomplete="off"><br>
	<input type="hidden" id="last_name" name="last_name" autocomplete="off">
</div>

</body>
</html>

Try following

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("input").focusout(function(){
        // splitting the value by space which returns an array
        let temp = $(this).val().trim().split(" "); 
        // the firstr value as first name and removing it from array 
        let first_name = temp.shift();
        // Joining the remaining values by space and setting it as second name 
        let last_name = temp.join(" ");
    	$('input#first_name').val(first_name);
      $('input#last_name').val(last_name);
      temp
    });
});
</script>
</head>
<body>

<div style="border: 1px solid black;padding:10px;">
  Name: <input id="name" name="name" autocomplete="off">
	<input type="hidden" id="first_name" name="first_name" autocomplete="off"><br>
	<input type="hidden" id="last_name" name="last_name" autocomplete="off">
</div>

</body>
</html>

JavaScript String split() Method, String split() Method: The str.split() function is used to split the given string into array of This method adds the elements of an array into a string and returns the newly How to Draw Smooth Curve Through Multiple Points using JavaScript ? The split() method is used to split a string into an array of substrings, and returns the new array. Tip: If an empty string ("") is used as the separator, the string is split between each character. Note: The split() method does not change the original string.

String#substr and String#indexOf could be used to get string before first space and after first space.

Note: For the sake of demo, I have kept hidden inputs as text

$(document).ready(function() {
  $("input#name").blur(function() {
    var name = $(this).val();


    var fname = name.substr(0, name.indexOf(' '));
    var lname = name.substr(name.indexOf(' ') + 1);
    $('input#first_name').val(fname);
    $('input#last_name').val(lname);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<div style="border: 1px solid black;padding:10px;">
  Name: <input id="name" name="name" autocomplete="off">
  <input type="text" id="first_name" name="first_name" autocomplete="off"><br>
  <input type="text" id="last_name" name="last_name" autocomplete="off">
</div>

JavaScript, 7) established a maximum length of 2^53 - 1 elements. (str) { // The string iterator that is used here iterates over characters, // not mere code  It determines on what basis the string will be split. The separator character can be any regular character. The limit character tells the program how many elements to create when the string is split. Portions of the string that remain after the split will not be included in the resulting array.

There isn't a split once function but you could do this:

<!DOCTYPE html>
<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script>
    $(document).ready(function() {
      $("input").focusout(function() {
        var names = $(this).val().split(" ");
        var firstName = names.shift();
        var lastName = names.join(" ")
        $('input#first_name').val(firstName);
        $('input#last_name').val(lastName);
      });
    });
  </script>
</head>

<body>

  <div style="border: 1px solid black;padding:10px;">
    Name: <input id="name" name="name" autocomplete="off">
    <input type="hidden" id="first_name" name="first_name" autocomplete="off"><br>
    <input type="hidden" id="last_name" name="last_name" autocomplete="off">
  </div>

</body>

</html>

String.prototype.split(), Here are some more FAQ related to this topic: How to create a string by joining the elements of an array in JavaScript · How to find substring between the two  var array = str.split('-'); var a = array[0]; var b = array[1]; var c = array[2]; Because for the code that I'm writing at the moment such a method would be a real pain, I'm creating 20 variables from 7 different splits and don't want to have to use such a verbose method.

try this simple thing just split it with space which returns array

 $( "#name" ).change(function() {
      var name = $("#name").val();

      var fname = name.substr(0, name.indexOf(' '));
      var lname = name.substr(name.indexOf(' ') + 1);        

      $("first_name").val(fname);
      $("last_name").val(lname);
    });

String length, In JavaScript, split() is a string method that is used to split a string into an array the split() method returned an array of 2 elements consisting of 'Tech' and 'On'  But if the parsing of the string is complex and the variants are too many then use an external script with a complete programming language. Connect to the database, for example in Java, process the string and insert the results in the new table. Remember to use bulk operations if your rows number is huge, so it will be faster.

You can use split(/\s+/) which will create a array of words that you will input in the input box then set the first_name with the first element of array and rest all the other words will go into the last_name:

$(document).ready(function() {
  $("input").focusout(function() {
    var nameArr = $(this).val().split(/\s+/);
    var first_name = nameArr[0];
    //remove first name
    nameArr.shift();
    var last_name = nameArr.join(' ');
    $('#first_name').val(first_name);
    $('#last_name').val(last_name);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div style="border: 1px solid black;padding:10px;">
  Name: <input id="name" name="name" autocomplete="off">
  <input type="hidden" id="first_name" name="first_name" autocomplete="off"><br>
  <input type="hidden" id="last_name" name="last_name" autocomplete="off">
</div>

How to Explode or Split a String in JavaScript, Last update on February 26 2020 08:08:59 (UTC/GMT +8 hours) Write a JavaScript program to split a multiline string into an array of lines. const toTitleCase = str => str .match(/[A-Z]{2,}(? "Some Database Field Name" "Some Label That Needs To Be Title Cased" "Some Package Name" "Some Mixed  How to split a column with delimited string into multiple columns. Long time ago I found that data might come in many different formats, mostly related with the data source, Cellphone Numbers, User Names, addresses are some examples of data that commonly comes in delimited format.

JavaScript: String split() method, Selection from JavaScript: The Definitive Guide, 5th Edition [Book] An optional character or string used to separate one element of the array from the next in and then concatenating them together, with the separator string between elements. a = new Array(1, 2, 3, "testing"); s = a.join("+"); // s is the string "1+2+3​+testing"  I have a string value which has numeric values separated by comma and then by a pipe. I want to split them into a table with two columns. I could split the string by one delimiter but unfortunately couldn't find a way to split by two. Please help. DECLARE @list NVARCHAR(MAX) = '1,101|2,202|3,303'; The result should be like below.

JavaScript fundamental (ES6 Syntax): Split a multiline string into an , Also for multiple strings, we can loop through the values with the split method. var fullData ='{"fname":"Thomas","lname":"Cook  JavaScript has a very useful method for splitting a string by a character and creating a new array out of the sections. We will use the split() method to separate the array by a whitespace character, represented by " ".

Array.join( ): concatenate array elements to form a string , A protip by davidcollingwood about multiple, javascript, and sort. This was a small issue I came across recently and the solution I found was so brilliant I thought it was worth sharing on here.

Comments
  • "Is it possible if I enter more than one name in the name field that everything after the space is moved to last_name?" - Why would you want to do that, the last name of John Fitzgerald Kennedy is not "Fitzgerald Kennedy" …
  • @michaelmcgurk - Glad to help you!
  • This almost works, however first_name value is [object HTMLInputElement]
  • I had a typo, fixed that
  • It will fail to collect anything after the second word
  • sorry its late bbut i have updated my answer try this