How to replace plus (+) signs with spaces ( ) in GET parameters with javascript

Question

I get users redirected to my site with GET parameters like this: www.example.com/?email=mail@mail.com&vorname=name1+name2

I use javascript to populate my texfields (newsletter subscription) like this:

function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
        vars[key] = value;
    });
    return vars;
}

function getUrlParam(parameter, defaultvalue){
    var urlparameter = defaultvalue;
    if(window.location.href.indexOf(parameter) > -1){
        urlparameter = getUrlVars()[parameter];
        }
    return urlparameter;
}

var vornametxt = getUrlParam('vorname','');
var emailtxt = getUrlParam('email','');

document.querySelector("input[name=nn]").value = vornametxt;
document.querySelector("input[name=ne]").value = emailtxt;

Like this it works properly but the parameter "vornametxt" contains plus signs if the GET parameter contains them. I want to replace the plus signs in the names with spaces which should work like this:

vornametxt = vornametxt.replace(/\+/g, " ");

That's what I found in older questions on stack overflow but it doesn't work. What am I doing wrong? Is it possible that my wordpress site doesn't allow certain code?

I am using Wordpress and a plugin which allows me to add this javascript code to my sites footer.

You are replacing with an empty string instead of a space. – ASDFGerte Aug 07 '18 at 15:46 — ASDFGerte, Aug 07 '18 at 15:46
Thanks I fixed it. Sadly this wasn't the issue though. – user363808 Aug 07 '18 at 16:00 — user363808, Aug 07 '18 at 16:00

score 2 · Accepted Answer · answered Aug 07 '18 at 15:46

Those values are URI-encoded with + meaning "space". To decode them, replace + with space and then use decodeURIComponent (to handle any other chars that have been encoded). I think it would go in your getUrlParam function, right at the end:

return decodeURIComponent(urlparameter.replace(/\+/g, " "));

Live Example:

(function() {
    var window = {
        location: {
            href: "http://www.example.com/&email=mail@mail.com&vorname=name1+name2"
        }
    };

    function getUrlVars() {
        var vars = {};
        var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m, key, value) {
            vars[key] = value;
        });
        return vars;
    }
  
    function getUrlParam(parameter, defaultvalue){
        var urlparameter = defaultvalue;
        if (window.location.href.indexOf(parameter) > -1) {
            urlparameter = getUrlVars()[parameter];
        }
        return decodeURIComponent(urlparameter.replace(/\+/g, " "));
    }
  
    var vornametxt = getUrlParam('vorname','');
    var emailtxt = getUrlParam('email','');
  
    document.querySelector("input[name=nn]").value = vornametxt;
    document.querySelector("input[name=ne]").value = emailtxt;
})();

<input type="text" name="nn">
<br><input type="text" name="ne">

How to replace plus (+) signs with spaces ( ) in GET parameters with javascript

1 Answers1