How can I remove just certain parameters from an URL based on their parameters? For example, If I want to programmatically remove any parameter sets that contain the value "all" i.e. when an Ajax event completes.
www.foobar.com/page?year=all&language=all&gender=female to: www.foobar.com/page?gender=female
Using JS or jQuery.
var queryParameters = {}, queryString = location.search.substring(1),
re = /([^&=]+)=([^&]*)/g, m;
while (m = re.exec(queryString)) {
queryParameters[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
}
// Add new parameters or update existing ones
queryParameters['newParameter'] = 'new parameter';
queryParameters['existingParameter'] = 'new value';
location.search = $.param(queryParameters);
// Handy function to parse the URL and get a map of the query parameters
function parseQueryParameters(url) {
var qp = {};
if (!url) {
return qp;
}
var queryString = url.split('?')[1];
if (!queryString) {
return qp;
}
return queryString.split('&')
.reduce(function(m, d) {
var splits = d.split('=');
var key = splits[0];
var value = splits[1];
if (key && value) {
m[key] = value;
}
return m;
}, qp);
}
//Function to build a url given a map of query parameters
function buildUrl(url, queryParams) {
if (!url) {
return null;
}
if (!queryParams) {
return url;
}
return Object.keys(queryParams)
.reduce(function(m, key, i) {
m += ((i === 0 ? "?" : "&") + key + "=" + queryParams[key]);
return m;
}, url)
}
function cleanUrl(url) {
//If no URL was provided, do nothing
if (!url) return;
//Parse and get all query parameters as a map
var qp = parseQueryParameters(url);
//Create a new map to hold the filtered query parameters
var newQp = {};
//For each query paremeter check the value and add only the required ones to the new map
//PS: You can also use map/reduce/filter to do this
//Using a simple for loop here for clarity
var keys = Object.keys(qp);
for (var i = 0; i < keys.length; i++) {
var currentKey = keys[i];
//Add only if parameter value is not 'all'
if (qp[currentKey] !== 'all') {
newQp[currentKey] = qp[currentKey];
}
}
//Build new URL from filtered query parameters
return buildUrl(url.split('?')[0], newQp);
}
//Call cleanUrl with URL
cleanUrl("http://example.com?a=all&b=all&c=none"); //Returns "http://example.com?c=none"
You can use URL() constructor, URLSearchParams() to get query string of URL as an Array of arrays of properties and values corresponding to query string parameters, Array.prototype.filter() and RegExp.prototype.test() to remove query string parameters from array, and URLSearchParams() again to reconstruct filtered query string parameters
let src = "https://www.foobar.com/page?year=all&language=all&gender=female";
let url = new URL(src);
let re = /all/;
let props = [...new URLSearchParams(url.search)]
.filter(([key, prop]) => !re.test(prop));
url = url.origin + url.pathname;
let params = new URLSearchParams();
props.forEach(([key, prop]) => params.set(key, prop));
url += "?" + params.toString();
console.log(url);