Remove a parameter to the URL with JavaScript [duplicate]

Question

Original URL:

http://yourewebsite.php?id=10&color_id=1

Resulting URL:

http://yourewebsite.php?id=10

I got the function adding Param

function insertParam(key, value){
    key = escape(key); value = escape(value);
    var kvp = document.location.search.substr(1).split('&');
    var i=kvp.length; var x; while(i--) 
    {
        x = kvp[i].split('=');

        if (x[0]==key)
        {
            x[1] = value;
            kvp[i] = x.join('=');
            break;
        }
    }
    if(i<0) {kvp[kvp.length] = [key,value].join('=');}

    //this will reload the page, it's likely better to store this until finished
    document.location.search = kvp.join('&'); 
}

but I need to function to remove Param

Just a sidenote - you didn' open the curly,brackets after declaring your function. — jdepypere
– jdepypere, Commented Jun 5, 2013 at 13:25
We need more details: remove based on what? Only the last? Based on the key? — user447356
– user447356, Commented Jun 5, 2013 at 13:28
If you only want the first parameter (id), you could split("&")[0]; — tymeJV
– tymeJV, Commented Jun 5, 2013 at 13:29
Thanks for the reply guy. I got the code from this question here- stackoverflow.com/questions/486896/…. And I just want to reverse the code to remove the adding parameter url. I not good in javascript. — Jows
– Jows, Commented Jun 5, 2013 at 13:39
In the same question there is a class which can also remove parameters: stackoverflow.com/a/487103/1266242 — David Mulder
– David Mulder, Commented Jun 5, 2013 at 13:46

Anthony Hessler · Accepted Answer · 2021-02-05 10:18:12Z

120

Try this. Just pass in the param you want to remove from the URL and the original URL value, and the function will strip it out for you.

function removeParam(key, sourceURL) {
    var rtn = sourceURL.split("?")[0],
        param,
        params_arr = [],
        queryString = (sourceURL.indexOf("?") !== -1) ? sourceURL.split("?")[1] : "";
    if (queryString !== "") {
        params_arr = queryString.split("&");
        for (var i = params_arr.length - 1; i >= 0; i -= 1) {
            param = params_arr[i].split("=")[0];
            if (param === key) {
                params_arr.splice(i, 1);
            }
        }
        if (params_arr.length) rtn = rtn + "?" + params_arr.join("&");
    }
    return rtn;
}

To use it, simply do something like this:

var originalURL = "http://yourewebsite.com?id=10&color_id=1";
var alteredURL = removeParam("color_id", originalURL);

The var alteredURL will be the output you desire.

Hope it helps!

edited Feb 5, 2021 at 10:18

user753676

answered Jun 5, 2013 at 13:50

Anthony Hessler

1,4891 gold badge12 silver badges10 bronze badges

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

7 Comments

Jows Over a year ago

Wow!Thanks. It really help's me. Thanks a lot.

oknate Over a year ago

if it strips all parameters, you would want to not use this line: rtn = rtn + "?" + params_arr.join("&"); you'd want to test if params_arr.length > 0 first.

echo_Me Over a year ago

You may look in the other answer i edited to push your new url directly to the url bar .

Paul Walczewski Over a year ago

nice. Altered it with simple checking in the end for params_arr length, so we don't get "?" if there are no more get params left. Like so: if (params_arr.length > 0) { rtn = rtn + "?" + params_arr.join("&"); }

Dharmang Over a year ago

here negative loop is intentional, for (var i = params_arr.length - 1; i >= 0; i -= 1) { it will remove if parameter is include multiple times.

|

echo_Me · Accepted Answer · 2015-02-26 06:34:19Z

17

function removeParam(parameter)
{
  var url=document.location.href;
  var urlparts= url.split('?');

 if (urlparts.length>=2)
 {
  var urlBase=urlparts.shift(); 
  var queryString=urlparts.join("?"); 

  var prefix = encodeURIComponent(parameter)+'=';
  var pars = queryString.split(/[&;]/g);
  for (var i= pars.length; i-->0;)               
      if (pars[i].lastIndexOf(prefix, 0)!==-1)   
          pars.splice(i, 1);
  url = urlBase+'?'+pars.join('&');
  window.history.pushState('',document.title,url); // added this line to push the new url directly to url bar .

}
return url;
}

This will resolve your problem

edited Feb 26, 2015 at 6:34

echo_Me

37.2k5 gold badges62 silver badges81 bronze badges

answered Jun 5, 2013 at 13:57

Arun Chandran Chackachattil

3,3627 gold badges33 silver badges45 bronze badges

4 Comments

HumanInDisguise Over a year ago

Have combined the window.history.pushState with the replacement from stackoverflow.com/a/7171293/2067690 - works well.

Cameron Over a year ago

I'd use document.location.search instead of just splitting, and it needs something like this added to preserve hash if (document.location.hash) { url = url + document.location.hash; }

pmrotule Over a year ago

I would use replaceState instead of pushState. It's a matter of opinion, but I don't think that removing a parameter from the url should be a new history state.

sk8terboi87 ツ Over a year ago

This seems more easy way to do developer.mozilla.org/en-US/docs/Web/API/URLSearchParams/delete

Collectives™ on Stack Overflow

Remove a parameter to the URL with JavaScript [duplicate]

2 Answers 2

7 Comments

4 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

4 Comments

Linked

Related