Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Rails and modal jquery dialog form

Tags:

I'm new to using jquery modal dialog boxes with rails and was wondering how I can :

  1. show a jquery modal dialog box with 1 field (eg "title")
  2. post this form to a rails controller (via ajax)
  3. have the modal dialog form redisplay if field is not filled in (with normal red css in error field)

Any tutorials or examples welcome.

Using Rails 3 and jQuery. Thanks for your time.

like image 555
robzolkos Avatar asked Jun 16 '11 15:06

robzolkos


2 Answers

Here's an example of how I'd do it: https://github.com/ramblex/modal-form.

You should be able to:

  1. download the app
  2. run bundle
  3. rake db:migrate
  4. rails s
  5. Go to localhost:3000/articles and the modal form should come up when you click on the 'New article' link.

An error message should be shown when the title field is left empty. Otherwise it should create the article and display it.

Hope it helps.

like image 134
ramblex Avatar answered Oct 04 '22 12:10

ramblex


For modal box I use jQuery Tools.

Once you set that up, next step is to bind an ajax request when the form is submitted (eg: form.submit(function(){ $.post... })) and post the form's data to controller.

Third step is setting up your Rails controller to respond to ajax request (using respond_to block) and render something as response (probably using :layout => false).

If validation failed, you will replace content of your modal box with this response body, or if successful (let's say response was just head :ok), you will display a success message.

I hope this makes sense to you.

like image 43
Mirko Avatar answered Oct 04 '22 13:10

Mirko