jquery - How to asynchronously load a partial page in rails -

jquery - How to asynchronously load a partial page in rails -

in creating ruby on rails / jquery app, there's part of page time-consuming generate.

i want alter how page loaded of page loads right away, , placeholder reserved time-consuming part load asynchronously, , injected page ajax / jquery when finished.

what have (simplified):

app/views/sample/show.html.erb:

<div id="theresult"> <%= render :partial => 'calculate', :object => @org) %> </div>

and partial utilize parts @org generate content (hitting external rest service).

app/views/sample/_calculate.html.erb

<% # code take org , turn content %> <!--...html display results here -->

i realize breaking proper mvc architecture rules since partial seems have much logic, , clean well...

so guess have 2 questions in one: (1) how work, , (2) how should clean follow ruby/rails/mvc practices?

first set empty, placeholder div in main response

<div id="pink-dancing-elephants"></div>

and add together little jquery page

$.ajax({ url: "/elephants/dancing", cache: false, success: function(html){ $("#pink-dancing-elephants").append(html); } });

and have action responses /elephants/dancing/pink homecoming blob of html want have fill div. in action invoked ajax request, you'll want render :layout => false maintain returned blob of html including entire frame. e.g.

# elephants_controller.rb def dancing @elephants = #whatever render :layout => false end

this render template in views/elephants/dancing.html.erb.

jquery ruby-on-rails ajax