Problem with back button following a postback on Jquery Mobile - asp.net-mvc

I'm having problems with JQM beta1 (the same thing happens with beta2) and ASP.NET MVC 3.
I have several pages with forms, and they post to the same address of the page, then with MVC RedirectToAction the next page is called.
Initially I had problems with the back button, which I solved by adding the attribute data-url to the page div.
But now I have this page that has a server-side validation, so posting back a page with the same data-url, when the server-side validation keeps the user on the same page, and then user hits the back button, the url on the browser is changed correctly but the page is not rendered again, it seems to remain the same, then if I hit the back button again I can see the correct page (2 steps behind page).
This should not be so problematic, since there should be many sites using forms with validation and needing the back button working properly.
Is there any special attribute that needs to be set on the page div when the post stays on the same page?
Thanks!

Related

Rails InvalidAuthenticityToken only in one case

Experiencing a really strange problem with csrf tags, I can't pin down. Here is the strange behavior:
If I manually enter the address for a form page, http://localhost:port/form_page, everthing works fine.
If I submit the form and there are errors, I redirect back to the form_page with errors, and everything works fine.
BUT, if I click on a link I created on another page with href='http://localhost:port/form_page', and then submit the form, I get an InvalidAuthenticityToken.
If I click on the link as in 3, then refresh the page before submitting, the form submits fine.
Not sure what I can change, since the form and controller appear to be good and are the same used in every case, but only fails in 25% of the cases above.

Ruby on Rails: Page Redirect Issue

I am having trouble with a page redirect issue in a small multi-step form process within a Rails application. Here's the rundown,
1.) There are 3 pages to this form with a, "save" and "next", button at the bottom of each page.
2.) If a user has filled out new information on the page, and attempts to click the next button, a warning modal popups and prompts the user to save their changes, or discard. This is where my issue is occurring.
3.) Instead of directing the user to the next page as they intended after pressing the modal save button, it instead just refreshes the same page the user is currently on.
I've tried everything, but honestly am not very experienced with Rails. I have made a collection on codepen for you to see all of the files.
Rails Files
Quick breakdown of the three files you will see.
1.) The saveModal is the popup that prompts for save or discard.
2.) Skills is just one of the 3 pages in the form. Any important info for you here would be at the top and bottom of the document I assume.
3.) The controller code where I think the redirect is happening is also 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.

Jquery Mobile Logon Loop

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!

Resources