Using jQuery to append URL with anchor #

Question

While retrieving items via AJAX etc., the links are set to do this:

$(this).click(function(){
ajax_function(); // hypothetical ajax call that puts data into a <div> of my choice
return false;
});

In this scenario, I'm wondering what the best way is to utilize jQuery to add things to my URL in this format:

http://www.mydomain.com/products

turns into

http://www.mydamain.com/products#category-12,page-4

Further note- I'm talking about the actual URL of the browser (in the URL bar) not a URL that is part of the DOM.

Starx · Accepted Answer · 2011-12-02 06:24:33Z

1

May be something like

oldlink = $('#mylinkselector').attr("href");
newlink = oldlink="#category-12,page-4";
$("#mylinkselector").prop("href",newlink);

answered Dec 2, 2011 at 6:24

Starx

79.3k50 gold badges187 silver badges266 bronze badges

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

2 Comments

Starx Over a year ago

In case you don't know about prop function go here

jeffkee Over a year ago

I was talking about the browser window's actual URL. I want to be able to allow URL sharing that initiates the right AJAX call to get the right category & pagenum based on URL entry.

jeffkee · Accepted Answer · 2011-12-02 06:59:49Z

1

After searching some more (with better keywords than before on Google) I found the answers I needed, and I wrote the following functions:

    function get_url_hash(argument) {
    var hash = location.hash.replace('#','');
    if(argument=='' || argument==undefined) {
        return hash;
        alert(blank);
    } else {
        var foundhash = false;
        // specific argument given - let's find the value attached. 
        var hashblock = hash.split(',');
        for(x in hashblock) {
            var hasharray = hashblock[x].split('-');
            if(hasharray[0]==argument) {
                return hasharray[1];
                foundhash = true;
            }
        }
        if(foundhash==false) {
            return false;
        }
    }
}

function modify_url_hash(argument, value) {
    // This function goes through the entire hash,
    // figures out which parts of the hash should be added, updated or removed based on entry, 
    // and then spits out final result. 
    var hash = get_url_hash();
    var foundhash = false; // foundhash is set to false by default. if this hash is NOT found, then we add it at the end! 
    var hashcount = 0; // keep count of total # so as to determine where to put the commas etc. 
    var newhash = '';
    if(hash.length>0) {
        var hashblock = hash.split(',');
        for(x in hashblock) {
            var hasharray = hashblock[x].split('-');
            if(hasharray[0]==argument) {
                hasharray[1] = value;
                foundhash = true;
            }

            if(hasharray[1]!=false && hasharray[1]!='') { // if new value is NOT false, we keep it in.. otherwise don't feed it to newhas so it disappears.
                if(hashcount>0) { newhash = newhash+','; }
                newhash = newhash+hasharray[0]+'-'+hasharray[1];
                hashcount++;
            }

        }
    }

    if(foundhash==false) {
        // this is a new hash block. 
        if(hashcount>0) { newhash = newhash+','; }
        newhash = newhash+argument+'-'+value;
    }
    location.hash = newhash;
}

edited Dec 2, 2011 at 6:59

answered Dec 2, 2011 at 6:49

jeffkee

5,26412 gold badges47 silver badges80 bronze badges

2 Comments

maček Over a year ago

This looks very complicated for what seems to be a simple task. Please make your original question more specific and I'm sure the community can find something more elegant.

jeffkee Over a year ago

It works perfectly and does everything I need - 24 hours later, more testing, and it's working magically. Go to traumatech.sonikastudios.com/ourproducts and test the dropdowns & page numbers on products. Basically, on each call of changing the hash value, I simply run modify_url_hash('category',12); or something like that. If there's no category, it adds category-12 to the # hash. If there is one, it changes the number to the new value. If I run modify_url_hash('category', false); then it simply removes it.

Collectives™ on Stack Overflow

Using jQuery to append URL with anchor #

2 Answers 2

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related