CODEWITHSUNDEEP
javascript
c14kaa
c14kaa

Reputation: 903

An intelligent Javascript back button that doesnt use history()

Im developing on a platform that has some limitations on how i can implement a proper back button.

So i need to create a button that does more then just "javascript:history.back()"

Let me explain:

page1...clicks through to...
page2...fill in the fields and submit to itself...
page2?something=else... here is where the back button is needed

on page2?something=else i want the back button to take the user back to page1

page1 = could be any page (so cant link directly)

is there a function that will know changes in the URL as well as remember the URL when the page is submitted?

Please lety me know if you would like more info.

Thanks

Upvotes: 0

Views: 2134

Answers (2)

Andy E
Andy E

Reputation: 344753

One way you could achieve this is during the form submission on page2. Where it would normally submit a form to itself, your script would intercept the submit action and replace the current item in the history instead. In order to do this, you would need to reconstruct the query string values:

myForm.onsubmit = function () {
    var url = this.action,   // The URL where the form is submitted
        els = this.elements, // A list of all the input elements
        qs  = "?",           // The query string we're constructing
        enc = function (s) { // Function for encoding
            return encodeURIComponent(s).replace(/%20/g, "+");
        };

    for (var i=0, max = els.length; i < max; i++) {
        if (els[i].disabled || !els[i].name)
            continue;

        qs += enc(els[i].name) + "=" + enc(els[i].value) + "&"; 
    }

    // chop off the final ampersand
    qs = qs.slice(0, -1);

    // Replace the current entry in the history
    window.location.replace(action + qs);

    // Cancel the default form submission
    return false;
}

It will probably need a little refinement to suit your needs but you get the general idea. Now both the browser's back button and your own back button should return to page1. This approach won't work for POST submissions, however.

Upvotes: 1

MrEyes
MrEyes

Reputation: 13750

There are a couple of different ways you could solve this problem.

The first of these depends on the assumption that the number of history pages between Page1 and page2?something=else is always the same.

javascript: window.history.go(-2)

Notice the -2 this tells the browser how many pages to go back.

The second option which would be more laborious, but ultimately a lot more reliable, would be to store the current users breadcrumb (i.e. the pages they have transitted through) in a session and then use the session data to construct your back link.

A third option would be to pass the page/address the back link should point to as post/get parameters through all pages. When the user hits the page that the back link appears on you can then use that data to construct the back link.

A fourth option would be to combine the first with either the second or third solution. i.e. pass the history count through on sessions/get/post and then use that to populate the number that goes into the Javascript .go(x) function

Upvotes: 0

Related Questions