Jquery Mobile Rails & Devise Error loading page when logging in with incorrect credentials

I am getting the hang of Rails 3 and have made a couple of working apps. I am new to using javascript or jquery with rails. I have a working app with rails 3.2, devise and cancan. I then converted it to use Jquery Mobile. The whole app is using it, I made no distinction between desktop and mobile.

Problem:

In general everything is working fine except for a few small things. One is that I can login successfully with correct credentials and once logged in the flash will display that I am signed in. If I login with incorrect credentials it just displays a Error loading page (no flash message like normal to say Invalid email or password). All other flash messages is displaying correctly as far as I can see (yellow formatted by JQM).

What I have done so far:

Searched high and low for similar problems but no joy (most similar are redirect or page not found errors). In Firebug it show 401 Unauthorized - Response - Invalid email or password.

I have commented out all cancan stuff (it is all working without the JQM) - and that makes no difference - it is not that it is redirecting somewhere else where there are no permission ect.

I am not that familiar with how javascript/ajax changes normal rails behavior but any pointers would be appreciated.

Answers


Short Answer

The quickest way to solve this is to use rails g devise:views to copy the views for devise into your project so you can edit them. Then you'll want to add the following to the form_for line right after the :url in the new.html template for the session controller:

:html => {:data => {:ajax => 'false'}}

This will tell jQuery Mobile that this form should not be hijacked and made into an ajax request.

The Reason

jQuery Mobile will hijack all forms and links to turn them into ajax requests. Unless you setup a respond_to block in your controllers Rails will still render whatever template you have set. This normally isn't a problem as jQM just parses out the necessary page div. However, Devise's controllers will respond differently based on the request and you are receiving an ajax response that jQM doesn't know how to handle. This is why the easiest solution above is to make jQM not turn the signin form into an ajax request. Other potential solutions include modifying the session controller or adding code a default the ajax success handler to check for non status 200 returning responses and handle them appropriately.


Need Your Help

Simple delete HQL and “unexpected end of subtree”

hibernate java-ee hql

When I run these two lines , I end up with "unexpected end of subtree"

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.