Tuesday, April 17, 2012

Remove querystring from URL


What is an easy way to remove the querystring from a Path in Javascript? I have seen a plugin for Jquery that uses window.location.search. I can not do that: The URL in my case is a variable that is set from AJAX.




var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3&SortOrder=dsc'


Source: Tips4all

4 comments:

  1. An easy way to get this is:

    function getPathFromUrl(url) {
    return url.split("?")[0];
    }

    ReplyDelete
  2. 2nd Update: In attempt to provide a comprehensive answer, I am benchmarking the three methods proposed in the various answers.

    var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
    var i;

    // Testing the substring method
    i = 0;
    console.time('10k substring');
    while (i < 10000) {
    testURL.substring(0, testURL.indexOf('?'));
    i++;
    }
    console.timeEnd('10k substring');

    // Testing the split method
    i = 0;
    console.time('10k split');
    while (i < 10000) {
    testURL.split('?')[0];
    i++;
    }
    console.timeEnd('10k split');

    // Testing the RegEx method
    i = 0;
    var re = new RegExp("[^?]+");
    console.time('10k regex');
    while (i < 10000) {
    testURL.match(re)[0];
    i++;
    }
    console.timeEnd('10k regex');


    Results in Firefox 3.5.8 on Mac OS X 10.6.2:

    10k substring: 16ms
    10k split: 25ms
    10k regex: 44ms


    Results in Chrome 5.0.307.11 on Mac OS X 10.6.2:

    10k substring: 14ms
    10k split: 20ms
    10k regex: 15ms


    Note that the substring method is inferior in functionality as it returns a blank string if the URL does not contain a querystring. The other two methods would return the full URL, as expected. However it is interesting to note that the substring method is the fastest, especially in Firefox.



    1st UPDATE: Actually the split() method suggested by Robusto is a better solution that the one I suggested earlier, since it will work even when there is no querystring:

    var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
    testURL.split('?')[0]; // Returns: "/Products/List"

    var testURL2 = '/Products/List';
    testURL2.split('?')[0]; // Returns: "/Products/List"




    Original Answer:

    var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
    testURL.substring(0, testURL.indexOf('?')); // Returns: "/Products/List"

    ReplyDelete
  3. If you're into RegEx....

    var newURL = testURL.match(new RegExp("[^?]+"))

    ReplyDelete
  4. If you need to perform complex operation on URL, you can take a look to the jQuery url parser plugin.

    ReplyDelete