The simplest possible modal for jQuery for the Rails 3.1+ asset pipeline
Ruby CSS JavaScript CoffeeScript
Latest commit 9aa5e12 Jun 30, 2014 @dei79 Update

Currently I moved to angular-js for all my web applications. Because of that I do not maintain this project any more. It would be a pleasure for me to hand this project over to an other developer. Please just send me a note or create a issue if you are the one.


The simplest possible modal for jQuery for the Rails 3.1+ asset pipeline based on


In your Gemfile, add:

group :assets do
  gem 'jquery-ui-rails'
  gem 'jquery-modal-rails'

Require Everything

To require the jQuery modal modules, add the following to your application.js:

//= require jquery.ui.all
//= require jquery.modal

Also add the jQuery modal CSS to your application.css:

 *= require jquery.ui.all
 *= require jquery.modal

All images required by jQuery Modal are automatically served through the asset pipeline, so you are good to go! For example, this code will open a given DIV as a modal dialog

<div id="demo-form" class="demo-description" style="display: none; ">
    The basic dialog window is an overlay positioned within the viewport and is protected from page content
    (like select elements) shining through with an iframe. It has a title bar and a content area, and can be moved,
    resized and closed with the 'x' icon by default.

<%=  link_to_modal "Demo Form", "#demo-form", :class=>"button" %>

Opening an existing view via AJAX as a modal dialog is that easy:

<%=  link_to_modal "New User", new_user_path, :class=>"button" %>


The link_to_modal helper offers forms support. The following parameter ensures that every form which is part of the received html content will be submitted via AJAX request. As a requirement the controller action needs to support JSON

<%= link_to_modal 'New User', new_user_path, :remote => true %>

Cancel or Close buttons

All anchors generated with the link_to helper can be marked as a dialog close button. Just use the following sample:

<%= link_to 'Cancel', users_path, :rel => "modal:close" %>


Thank you to the following wonderful people and projects for contributing to jquery-modal-rails: