best practice for page navigation

Question

In most of the website, there is always a "back" to previous button. I am wondering they are usually implemented.

Basically I am building a site with more than 5 levels page depth. As an example, page level goes like:

Advance Search => Search Result => Search Details => Apply For Job => Save Job

I need to make sure that user can navigate back to it's previous level above, so from "search Details", they should be able to click back and then goes back to the "Search Result" page with all its previous search criteria preserved.

I am currently storing the "back url" as part of the query string paramter and append the url as user dives in deeper. The issue with this is that when as user dives in more than 3 levels, the url get really long and messy.

What would be the best practice for asp.net MVC apps to deal with this kind of issue?

score 2 · Answer 1 · answered Aug 20 '12 at 08:29

2

I am currently storing the "back url" as part of the query string paramter and append the url as user dives in deeper. The issue with this is that when as user dives in more than 3 levels, the url get really long and messy.

Don't store it in your url, but rather in your session. You can easily create a class (if that makes sense) encapsulating everything you want and just stick it in your session. If you're only after storing an url of the last page, simply store a string in a session.

Session["lastPage"] = "~/mypage.aspx";

It's much cleaner (and somewhat safer) than appending everything to your url. Using javascript isn't a good option here.

answered Aug 20 '12 at 08:29

walther

13,466
5
41
67

Storing in session might cause issues in web farms, session is store in the specific server's RAM. When the user's request get server by a different server in the webfarm, Session["lastPage"] will be null – Jack Aug 21 '12 at 02:03
@Jack, firstly, you CAN use sessions in a webfarm environment, don't see a problem in that. See this link for instance: http://stackoverflow.com/questions/686873/allowing-session-in-a-web-farm-is-stateserver-good-enough . If you can't use sessions from some other reason or plainly just don't want to, you can always use cookies. But sticking urls into the current url...err.. well, it's your choice, but I personally wouldn't do that if I still had other options to choose from. – walther Aug 21 '12 at 07:01

codingbiz · Answer 2 · 2012-08-20T07:47:51.600

1

Try this old javascript method

<a href="javascript:history.go(-1)">Go Back</a>

or

<input type="button" value="Go Back" onclick="history.go(-1)" />

That should be on each page which is not guaranteed to work in all scenario

edited Aug 20 '12 at 07:47

answered Aug 20 '12 at 07:35

codingbiz

26,179
8
59
96

if the user comes from other site, this will bring them back to that site instead of pages within my site – Jack Aug 20 '12 at 07:44
1

in that state, your site does not have a previous state and so it is normal. – codingbiz Aug 20 '12 at 08:13
I don't think any user would expect the behaviour of hitting "back button" in one site and go to a different website. – Jack Aug 21 '12 at 02:14

score 1 · Answer 3 · answered Aug 20 '12 at 07:41

1

Leave the back button to handle by the browser and not add it (again) to your site at all, because have many issues, like if the user open a new page, a new tab, or make a post to the same page - or come from other site then the back is not do what you think.

What you can add is a line menu, and/or a tree menu, and next/previous page that you know from the start.

answered Aug 20 '12 at 07:41

Aristos

66,005
16
114
150

tree menu is not part of the detail, we don't have a choice in implementing them and usually links in tree menu doesn't have search query parameters – Jack Aug 20 '12 at 07:48
@Jack ok, but the back button inside the page is not best practice. – Aristos Aug 20 '12 at 08:26
@Aristos - whether we should implement a "Back" button if the browser already has one is arguable. But, sometimes we want the browser to back to the previous page after the user successfully submits a page with a POST. Somehow the server needs to know where to send them, and that can be difficult if the navigation structure is many layers deep with many ways of arriving on any particular page. – Michael12345 Jan 06 '14 at 01:01

score 1 · Accepted Answer · edited Jul 29 '14 at 20:02

In an old web development platform I have used (several years back), this was solved using a built in function. The idea was that the server maintained some sort of internal collection of urls and mapped those to simple numbers. When you added a new url to the collection, the server would first check if that exact url was already present and if so just return the associated number. If the url you were adding was new, it would be added and a new number would be returned.

A couple of samples to illustrate... Let's assume the user starts out at page:

http://foo.bar.com/search/

I'll referr to this page a "Page 1". After adding the criteria to search for, the user will be shown the reuslts on page:

http://foo.bar.com/search/results?jobTitle=CEO&etc&etc

I'll call this "Page 2". On this page the user can click open a specific result and get to page:

http://foo.bar.com/search/results/12313

I'll call that "Page 3".

To have the "back to previous" functionality for pages 2 and 3, they would need to be opened with one additional query parameter. When page 1 is generating the url for page 2, the server would call the utility method SaveUrl() (on some suitable class) and append the result to the querystring so the url for page 2 becomes:

http://foo.bar.com/search/results?jobTitle=CEO&etc&etc&return_url=1

Notice the new return_url=1 query parameter. Page 2 would then use the corresponding GetReturnUrl(1) method to fetch the url to use in the "back to previous" link. This call would bring back the url that was added previously, which would be http://foo.bar.com/search/.

Going forward from page 2 to page 3 would also involve adding a new querystring parameter using the same SaveUrl(). The new url to page 3 would then be:

http://foo.bar.com/search/results/12313?return_url=2

On page 3, the "back to previous" page url would be fetched using GetReturnUrl(2), which would give back http://foo.bar.com/search/results?jobTitle=CEO&etc&etc&return_url=1.

So this system works by storing the url of the current page and supplying that in the url to the next page. And since the url for the current page contains a reference to the current page's previous page in the form of the query parameter, the back to previous trail is maintained.

I thought I would explain this because I think it's a smart way to handle the back to previous trail. I'm not claiming that it's any sort of industry standard or best practise though...

Edit: Some thoughts and considerations regarding this approach.

Pros:

Easy way to store and retrieve urls without causing an ever longer querystring

Cons:

Works as long as the url contains all the necessary state to go back.
Depending on the implementation details (global url collection? user specific url collection in Session? persist in Sql server?) it might cause issues in web farms (all servers need to agree on what url is stored as "1").
Might cause memory issues in high traffic sites (but that also depend on the specific implementation)

Nice thought! I have thought something similar, by storing user flow in a stack object in storage, pop it as user goes by backwards. Thanks for the detailed explaination — Jack, Aug 21 '12 at 02:11

best practice for page navigation

4 Answers4