Javascript Regex get elements from text

Question

I'm quite new to the javascript world an have no idea about regex; I hope you can help me with that one:

I need a function that gives me the elements of a text-block that a user can input through an <input/ on a website, so i can output them to another <input/.

Generalized input:

txt1/txt2_txt3#txt4_txt5@txt6

Real input-example ("personalcode"):

user/855042,5_512125#2431072,25_729106@coursname optionaladdition

What I got so far is the html stuff and this (-yep thats not much):

var base= document.getElementsByName("personalcode")[0].value;

What I would need to get out is:

var one = txt1;    //always letters
var two = txt2;    //always a decimal number
var three = txt3;  //always a decimal number
var four = txt4;   //always a decimal number
var five = txt5;   //always a decimal number
var six = txt6;    //can be letters and decimal numbers

There will never be special characters such as !"§$%&/()=?+*# inside a text element. ö, ü, ä is possible.

Example:

var one = user;
var two = 855042,5;
var three = 512125;
var four = 2431072,25;
var five = 729106;
var six = coursname optionaladdition;

In the end I want to output it like this:

document.getElementsByName("output-user")[0].value= one;
.
.
.

I hope you understand what I mean.

trig · Accepted Answer · 2017-04-07 09:53:09Z

2

var str = "user/855042,5_512125#2431072,25_729106@coursname optionaladdition";
var arr = str.split(/\/([\d,]+)_([\d,]+)#([\d,]+)_([\d,]+)@/);
# => ["user", "855042,5", "512125", "2431072,25", "729106", "coursname optionaladdition"]

edited Apr 7, 2017 at 9:53

answered Apr 7, 2017 at 9:38

trig

313 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

MiBrock · Accepted Answer · 2017-04-07 10:12:00Z

0

I hope i understand you right what you want to achieve.

I made a small fiddle for you how to get your Data. https://jsfiddle.net/zasg4zgx/6/

Here is the Code:

<form>
   Login :
  <input id="logthis" type="text" name="fnName" value="user/855042,5_512125#2431072,25_729106@coursname Löcher in Socken flicken">
  <input type="button" value="Login" onClick="javascript:SeperateLoginString(logthis.value)">
</form>

With the id i can transfer the Value of the login field to the function.

function SeperateLoginString(logData) {
 var seperateString = [];
 var temp = new String(logData);

    temp = temp.replace(/@/g, ' ').replace(/_/g, ' ').replace(/#/g, ' ').replace(/\//g, ' ');
    seperateString = temp.split(" ");

 var user   = seperateString[0];
 var value1 = seperateString[1];
 var value2 = seperateString[2];
 var value3 = seperateString[3];
 var value4 = seperateString[4];
 var value5 = seperateString[5];

With this loop you can add the "optionaladdition" to your value. I managed it so it can have more than one value

for (var i = 6; i < seperateString.length; i++) {
   value5 += " " + seperateString[i];
  }
 alert(value5);
}

Regards,Miriam

answered Apr 7, 2017 at 10:12

MiBrock

1,1001 gold badge11 silver badges22 bronze badges

2 Comments

Manuel T Over a year ago

Awesome! That one works perfectly! Löcher in Socken flicken ... sicherlich ein interessanter Kurs ;)

MiBrock Over a year ago

War das erste was mir einfiel ;-) Freut mich das ich helfen konnte

joepio · Accepted Answer · 2017-04-07 09:32:53Z

Since you are asking for six different variables, I suggest you use six different input tags. This would be easier for the user and especially for you as a developer. Parsing strings like this is asking for trouble.

However, you could get the values from the string using regex. For example, if you want your first variable (letters only), you could do something like this:

var 1 = text.match(/([A-z])+\//g).slice(0, - 1);

It basically matches a group of characters that starts with letters and ends with a forward slash. The slice method removes the last character from the string (the forward slash).

The second var could be selected like this:

var 2 = text.match(/([0-9])+\#/g).slice(0, - 1);

Still, I recommend you to just use multiple inputs. It's way cleaner and less prone to errors. Good luck!

Collectives™ on Stack Overflow

Javascript Regex get elements from text

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related