String building and concatenation in JavaScript

Question

I need some help with string building and concatenation in JavaScript.

I have a form on a website where a user inputs a VIP name which is then added to the end of my URL to build a dynamic dashboard.

My code:

$(window).on('load', function() {   
$('#open').click(function() {
    var fixedData1 = 'http://testwebsite/dashboard/db/omni-vip?var-vip=',   
        userEntry1 = $('#one').val();
    var newWindow = window.open(fixedData1 + userEntry1);
    newWindow.focus();
});
});

Example. User enters.... app-123.network.dcs1.domain.com

which would then open a new page with the URL:

http://testwebsite/dashboard/db/omni-vip?var-vip=app-123.network.dc.domain.com

This is great and works fine, however I want to make the 'DC' part a variable, I have two DC's dcS1/dcS2 at the moment a user would enter like the above and specify the dc in the name. This only opens a dashboard with that particular dc.

I want to be able to pass the VIP name with the dc as a variable, so

vip=app-123.network.$dc.domain.com

even if it is entered with a specific named dc by the user.

If this even possible? I don't know where to begin.

Thaks

Mike Chamberlain · Accepted Answer · 2017-04-11 12:32:48Z

1

Your question isn't quite clear, but if I've understood correctly, you want to accept entries like this:

XXX.dcS1.YYY
XXX.dcS2.YYY

but pass through the following to your service:

XXX.$dc.YYY

You can use a regex to make the substitution:

$(window).on('load', function() {   
    $('#open').click(function() {
        var regex = /\.(dcS[12])\./;
        var fixedData1 = 'http://testwebsite/dashboard/db/omni-vip?var-vip=',   
            userEntry1 = $('#one').val(),
            replaced = userEntry1.replace(regex, '.$dc.');

        var newWindow = window.open(fixedData1 + replaced);
        newWindow.focus();
    });
});

For the above, if the user entered app-123.network.dcS1.domain.com then they would be sent to http://testwebsite/dashboard/db/omni-vip?var-vip=app-123.network.$dc.domain.com.

Test out the regex here:

https://regex101.com/r/mCcR0D/2

If I haven't understood correctly then let me know.

edited Apr 11, 2017 at 12:32

answered Apr 11, 2017 at 11:50

Mike Chamberlain

43k28 gold badges113 silver badges160 bronze badges

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

2 Comments

user3236169 Over a year ago

Mike you the man! Yes you understood my question perfectly and the above looks great, I am though both new too and scared of Regex's, my example was simplified, dcs1/dcs2, my DC's are actually called PAL/PFW, any chance of a hand with the regex for that and I think the rest is perfect, if a user then enters either PAL or PFW it will pass back through to my service as xxxxx.$dc.yyyyy :) me = happy man!

Mike Chamberlain Over a year ago

Not sure regex is necessarily the best tool for such a simple replacement, but /\.(PAL|PFW)\./i should do it. regex101.com/r/mCcR0D/4

Jai · Accepted Answer · 2017-04-11 11:42:00Z

0

ES2015's back ticks can let you use ${} variable in strings:

$('#open').click(function() {
  let s = $('#one').val().toUpperCase().trim(); // s1 >>> S1
  let url = `http://testwebsite/dashboard/db/omni-vip?var-vip=app-123.network.dc${s}.domain.com`;
  let newWindow = window.open(url);
  newWindow.focus();
});

edited Apr 11, 2017 at 11:42

answered Apr 11, 2017 at 11:39

Jai

74.8k12 gold badges77 silver badges104 bronze badges

4 Comments

slebetman Over a year ago

But... user enters the string specifically the string that contains dc so he needs string.replace()

user3236169 Over a year ago

slebetman, any chance of an example with string replace? I can read all day and not get anywhere but one good example normally does the trick :)

Jai Over a year ago

var url = "http://testwebsite/dashboard/db/omni-vip?var-vip=app-123.network.dc"+s+".domain.com";

user5066707 Over a year ago

This is called TemplateLiteral, and it can also be tagged on the invokation (depending on how the function handles the arguments, though).

Collectives™ on Stack Overflow

String building and concatenation in JavaScript

2 Answers 2

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related