Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add parameters to a URL that already contains other parameters and maybe an anchor

Tags:

javascript

I'm wondering how I can add a new parameter to an existing url. The problem is: the url may also contain an anchor.

For example:

http://www.example.com?foo=bar#hashme

And I want to add another parameter to it, so it results in this:

http://www.example.com?foo=bar&x=y#hashme
like image 318
skerit Avatar asked Aug 05 '11 09:08

skerit


People also ask

How do I pass a URL with multiple parameters into a URL?

To add a parameter to the URL, add a /#/? to the end, followed by the parameter name, an equal sign (=), and the value of the parameter. You can add multiple parameters by including an ampersand (&) between each one.

How do I add a parameter to a URL query?

Query parameters are a defined set of parameters attached to the end of a url. They are extensions of the URL that are used to help define specific content or actions based on the data being passed. To append query params to the end of a URL, a '? ' Is added followed immediately by a query parameter.

How do I add parameters to a URL in HTML?

Parameters are added to the end of a URL after a '? ' symbol, and multiple parameters can be included when separated by the '&' symbol. Query parameters are primarily used to specify and sort content on a web page, but they're also often used for traffic tracking.

How do you append a URL?

Paste the URL parameter to the end of the URL in the text editor. Copy the full URL with the appended URL parameter. Post the URL to the desired location.


1 Answers

I used parts of The Awesome One's solution, and a solution found on this question:

Adding a parameter to the URL with JavaScript

Combining them into this script:

function addParameter(url, parameterName, parameterValue, atStart/*Add param before others*/){
    replaceDuplicates = true;
    if(url.indexOf('#') > 0){
        var cl = url.indexOf('#');
        urlhash = url.substring(url.indexOf('#'),url.length);
    } else {
        urlhash = '';
        cl = url.length;
    }
    sourceUrl = url.substring(0,cl);

    var urlParts = sourceUrl.split("?");
    var newQueryString = "";

    if (urlParts.length > 1)
    {
        var parameters = urlParts[1].split("&");
        for (var i=0; (i < parameters.length); i++)
        {
            var parameterParts = parameters[i].split("=");
            if (!(replaceDuplicates && parameterParts[0] == parameterName))
            {
                if (newQueryString == "")
                    newQueryString = "?";
                else
                    newQueryString += "&";
                newQueryString += parameterParts[0] + "=" + (parameterParts[1]?parameterParts[1]:'');
            }
        }
    }
    if (newQueryString == "")
        newQueryString = "?";

    if(atStart){
        newQueryString = '?'+ parameterName + "=" + parameterValue + (newQueryString.length>1?'&'+newQueryString.substring(1):'');
    } else {
        if (newQueryString !== "" && newQueryString != '?')
            newQueryString += "&";
        newQueryString += parameterName + "=" + (parameterValue?parameterValue:'');
    }
    return urlParts[0] + newQueryString + urlhash;
};

Example: addParameter('http://www.example.com?foo=bar#hashme', 'bla', 'valuebla', false)

Results in http://www.example.com?foo=bar&bla=valuebla#hashme

like image 115
skerit Avatar answered Sep 21 '22 06:09

skerit