twitter bootstrap modal login form question

644 views
Skip to first unread message

John S

unread,
May 16, 2012, 12:10:48 AM5/16/12
to ColdFusion on Wheels
I'm trying to create a login form using a modal from twitter
bootstrap. I can launch the form and login in successfully, but I have
not been able to show flash messages in the modal window when an
incorrect login attempt has been made. I'm not using ajax to submit
the form, but the form action. In my controller I'm using
redirectTo(back=true) , which works when the login is correct as it
closes the modal and returns to the calling page, but fails to leave
the modal open or reopen the modal when the calling page reloads. I
tried using the anchor argument with the redirectTo function, but I
also need to pass the data-toggle="modal" attribute I think. Is this
possible to do without making an ajax request, or is that the route I
should be taking?

Tom King

unread,
May 16, 2012, 4:02:50 AM5/16/12
to cfwh...@googlegroups.com
I'm pretty sure this would need to be an ajax submit of the form:
i.e ajax submit > authentication in the background > return boolean as to whether to close the modal > if all ok, close and redirect

Alternatively, use the modal for the intitial login, and if it fails, redirect to a non modal version of the form (probably a fair bit easier, and would give you an option if JS wasn't enabled).

John S

unread,
May 16, 2012, 10:05:44 AM5/16/12
to ColdFusion on Wheels
Thanks for the feedback Tom. I have the second option working, but if
I relaunch the modal after doing a redirectTo(back=true) my flash
error exists, so I was hoping that I could somehow relaunch the modal
as part of redirectTo call.

Tom King

unread,
May 16, 2012, 11:42:09 AM5/16/12
to cfwh...@googlegroups.com
If you send a full form request *not* via ajax, you'll get a page refresh.

Could you passback a URL var like ?relaunchModal=true on an incomplete authentication, then on page load, check for the url string and get JS to do  $('#loginform').modal('show')?
You could then (I guess) output the flashmessage in the modal if you wanted, or clear the flash struct seperately.

It'll be a bit wierd due to the page refresh though... personally I'd try and do it via JS...

(I'm not 100% sure what you're trying to achieve mind..)
T

John S

unread,
May 16, 2012, 12:46:18 PM5/16/12
to cfwh...@googlegroups.com

I was thinking about what you just proposed after reading your earlier comment this morning. Passing back a url variable to use JS to launch the modal is definitely something I'll try this evening, though doing the login form through ajax might be a better approach.

More background on what I'm trying to accomplish. I have a site that requires authentication for numerous pages. I'm using filters in my init method to define the pages that do not require authentication. The authentication is functional, but the forms our currently actual pages with their own controllers and views. I've started to theme the site using Twitter Bootstrap and thought that using modals for the forms would be a nice touch. 

I moved the form into a partial and included the partial into my general layout view file. Right now I'm just trying to get the modal authentication form working when a user clicks the link to login. Successful logins work great. The modal closes and the original page refreshes showing the user is now logged in. When the user is not successful I either have to redirect them to a non-modal login form or come up with a different solution to refresh the originating page and fire the modal again. I've not really looked into how the modal will work when the filter forces authentication, as this might be a different problem all together. 

Maybe I should be thinking about this in a different way. On a side note, I always enjoy your blog posts on cfWheels topics. Thanks for sharing your knowledge.

Tom King

unread,
May 17, 2012, 7:20:09 AM5/17/12
to cfwh...@googlegroups.com


On Wednesday, 16 May 2012 17:46:18 UTC+1, John S wrote:
Maybe I should be thinking about this in a different way. On a side note, I always enjoy your blog posts on cfWheels topics. Thanks for sharing your knowledge.

Cheers!
T
Reply all
Reply to author
Forward
0 new messages