Implement Modal in rails

Sometimes we need to show a modal window that comes flying on the website which really feels good as we do not have to load a new page.The reason why i love using modals is that you can show two things at the same time.For example:-Suppose user registers and logs in to your website,then immediately after a matter of seconds,you can show a modal to show/edit his profile OR add some more info about himself or similar stuff and all the user can do is just click button to continue/reject without changing the previous screen.Trust me...it feels good.see the example1,example2
   Similarly if You talk in context of Rails,If the user is in index page,you can render the show action in the Modal,Wowwww...so user can either see the stuff he clicked on index page or cancel the modal,thereby reducing your effort to reload or write extra code for index->show and again show->index.Enough of lectures...lets start the main stuff
To add MODAL to your application just follow two steps expecting that your are using CSS Framework such as Boostrap,Zurb:-

1. Add modal to your layout (application.html.erb)
2. Call your modal using   $('#myModal').modal();
3. Render partial inside modal body using js.erb(ajax call)

this is all you need to do.Lets see the code:-

==============application.html.erb
<!-- add modal view partial -->
<%= render(:partial => 'shared/main_layout_dialog_modal') %>

===========app./views/shared/_main_layout_dialog_modal.html.erb

  <div id="myModal" class="modal fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
  <div class="modal-content">
      <!-- no need of modal header -->
      <button class="close" type="button" data-dismiss="modal"><i class="fa-times-circle-o fa pull-right"  style="position: static;"></i></button>
    <div class="modal-body">
<!-- dynamic view comes here(_show.html.erb in our case) -->
    </div>
   </div>
  </div>
</div>

 ======================index.html.erb

  <!-- add remote true to each show link on index page -->
 <%= link_to(u.name,users_path(user.id),:remote=&gt;true)%>



=================- _show.html.erb

html/erb code for show comes here

=====================show.js.erb
  $('#myModal').modal();
  $('#myModal').find('.modal-body').html("<%= escape_javascript(render(:partial => 'users/show')) %>");
================================================================= 

So every click on index page will show a modal with _show.html.erb rendered inside the modal-body