Jquery Mobile Logon Loop - jquery-mobile

Knocked-out a simple jQuery Mobile site with [logon -> index -> content] pages.
If I use the back button to the logon page, I can't escape no matter what I do - forward, back, filling it in, nothing.
I'd like to remove the #logon page from the navigation, so you cannot get back to it without typing it in, or logging out - any advice?

Easiest way to keep a page from showing up in history (with jquery mobile) is show that page in a dialog. This model works particularly well in situations where the content that would be in a dialog is either tangential to the main content or some sort of interrupt (which the login process is). See an example here. DISLAIMER: this is not the right way to implement content like this in the long run, it is only meant to show the effect of using a dialog in a login process to bypass insertion into history.
Another (more manual) route would be to use the a normal jqm page and do your login by way of an ajax posting. If the response came back as successful, then use location.replace() to remove the the current (logon) page from history.

I ended up removing the ajax navigation full stop and sticking to manual, not as pretty but headaches avoided!

Related

Handling the back button while using multi step remote links

I have a 3 step report which loads by clicking a link with the remote: :true option, so it reloads a part of the page instead of refreshing the whole page. I also provide the user with breadcrumbs, so he/she can easily navigate between the steps. However, most users use the browser back button, which of course reloads the whole page. What is the "Rails way" of dealing with this? If the browser back button is clicked the user should see the previous step in the report.
If you need to control the history the user sees, but aren't doing full page reloads on form submit, you should be manipulating the history state via Javascript's history.pushState and friends.
Assuming the responds to the submitted form is some sort of evaluated Javascript, simply include the history state manipulations there.

JQuery Mobile Back Button Functionality

I think this must be a common scenario-- but I can't seem to find a solution.
JQueryMobile site with authentication functionality:
Link on all pages takes user to dynamically loaded authentication page
All pages have back button functionality
A bad username and password causes an ajax form submission
Clicking the back button in this scenario takes you back to the authentication page (which makes sense because that's where you came from-- but if I input a bad password five times, I have to click on the back button five times before I get back to where I came from)
I guess what I want is to have the ajax form submission for logging in taken out of the "hash" history.
One way to solve this would be by keeping track of the failed attempts numberOfAttempts++. Then using history.go(-numberOfAttempts); when the back button is clicked.

Ajax login dynamic popup dialog

I thought this should be pretty well documented, because it seems like a pretty common scenario. Unfortunately, I find a lot of conflicting information out there and no real consensus on the correct way to go about this in an MVC 3 compatible, unobtrusive Ajax sort of way. I can certainly hack together something that "works", but i'd rather do it the way it's supposed to be done via the framework.
Here's what I need. I have Login link in the upper right corner of the site. The site allows both authenticated and unauthenticated users. So, I want to have a dynamic ajax popup when the user clicks the Login link.
This should go out to the controller, and pull back the HTML for the login dialog. It should then be displayed in a jquery ui popup dialog, and when the users enters their information it should redirect them to the "Dashboard" page (regardless of what page they are currently on). If they enter the wrong credentials, it should stay on the current page with the popup dialog still open and display validation errors ("username or password incorrect").
In other words, it has to tie into mvc 3 unobtrusive validation and use unobtrusive ajax, and display things in a jquery ui dialog.
This seems to be less trivial than I thought it would be. Any pointers to an example that does this? Anyone have a sample they can share?
UPDATE:
The conventional wisdom is, if you need to redirect, don't make it Ajax. However, in this case Ajax is required because I need to validate the creditials and post validation errors without causing a page refresh, or a redirect to a different login page. I need for the authentication to go through and post the errors in the popup dialog.
Seems like what you are looking for: http://evolpin.wordpress.com/2011/04/26/asp-net-mvc-partial-view-and-ajax-real-world-example/
Take a look at the MVC 4 Developer Preview. They have implemented the logon and registration process as popup dialogs in the skeleton app that is generated when you create a new app. There are a lot of other cool features worth checking out in this preview. Here is what the popup looks like for logon. It uses JQuery UI.
The point about MVC 4 login preview is that it can be used in two modes. As a Ajax/jQuery popup or standard form.
It does have a bug. It doesn't handle cancelation properly.

How to redirect user to the page they were just at without them noticing?

The website viewer would be at page A, click a link that sends then to page B, but I want them to return to page A without them noticing.
When they click the link it changes the layout the viewer is browsing the site with, so the redirection code shouldn't erase or undo the cookies or whatever are stored with the link click. Thanks!
Edit:
Here's what I'm doing. I have a page called setskin.php that has php code that takes header and footer codes for different layouts and applies them. I don't know how to show code without it going crazy, so there's a screenshot of it here:
http://figmint.uuuq.com/Picture%202.png
I want to change my website so that in a sidebar there will be the same setskin options (so it will be on every page). I was fiddling and managed to make it so when you click the link for the skin you want it changes the skin, but then you end up at the setskin.php page, which I don't want. I was looking for a way to make it so it sends you to the setskin.php page (since I couldn't see how to change that) and then back to where you came from.
You should use AJAX. That way you can do whatever processing is needed behind the scenes with zero impact on the user.
You can check the referer header and return to that. But if that isn't set go to a default page?
Other options include putting the previous url as a parameter, like a 'next' parameter. Then redirect to that after you're done. Quite common pattern used for login.

mvc and the back button

I'm new to mvc so I don't know if there is a trick to this or not. When a user runs a search on a site I'm building and I take them to the results page, if I click the back button the search form is empty. Is there some way to keep the form fields populated as they were when going back (without resorting to session)? Thanks.
Strange.
Fields should be there by default. What browser are you using?
If you're using a regular browser, then maybe your doing something weird, like, resetting the fields via JavaScript or something. Perhaps elaborating more on your current implementation would help diagnosing your problem?
A last solution would be saving the fields as a cookie and loading them via JavaScript on the forms page inside onLoad.

Resources