Return to Previous Page

Problem

One request we receive frequently is:

How can I include a link on a page to return to the previous page?

Solution

If you view any of the codex detail pages, at the top of the page, you'll see one of the following links:

or:

or:

For the purposes of this tutorial, none of these links are active. THey simply point back to this page.

The source code on each of the codex detail pages is the same except for the displayed text and returned url. This is the source code for the Action Detail Page:

Depending on the calling page, the above code is changed dynamically on page load with jQuery to either the second or third link example above.

Dynamically Changing the Link

This is the source code we use for dynamically changing the link:

This code consists of two functions, getParameterByName() and a self-executing function that runs on the document.ready event.

The referrer_url variable is the page that triggered the load of the current page. In other words, it's the page to which we want to return. We're using a query string, to determine the dynamic text to display in the link. If this isn't important to you, there's no reason for you to use a query string.

The working code in our example to change the link href is:

If you're not using a query string, the working code for changing the link is simply:

If you're using this with a Formidable form, you can just as easily save the referring_url to a hidden field and use that value to populate the return link.

We hope you find this useful.

Reader Interactions

Leave a Reply

Your email address will not be published.