rigelstpierre
rigelstpierre

Reputation: 544

Loading View Via Ajax

I'm building an application that has a lot of graphs. I'd like to make the graphs load in via Ajax to reduce initial load time. This is what the current dashboard view looks like.

  <section class="container">
    <section class="row">
      <div class="span6 graph-container">
        <h3 class="box-header"><i class="icon-truck"></i>Service Levels</h3>
        <div class="box">
            <img src="/assets/loading.gif" class="loading" />
           <%= content_tag :div, "", id: "shipments-by-service-type", data: {shipments: @charts[:service_analysis][:spend_data]} %>
        </div>
      </div>
       <div class="span6 graph-container">
        <h3 class="box-header"><i class="icon-circle"></i>Weight Summary</h3>
        <div class="box">
          <%= content_tag :div, "", id: "weight-ranges", data: {weight: @charts[:weight_analysis][:spend_data]} %>
        </div>
      </div>
    </section>
    <section class="row">
      <div class="span6 graph-container">
        <h3 class="box-header"><i class="icon-road"></i>Zone Summary</h3>
        <div class="box">
          <%= content_tag :div, "", id: "weight-groups-zones", data: {zone: @charts[:zone_analysis][:spend_data]} %>
        </div>
      </div>
       <div class="span6 graph-container">
        <h3 class="box-header"><i class="icon-time"></i>Spend Over Time</h3>
        <div class="box">
          <%= content_tag :div, "", id: "shipping-trends", data: {trends: @charts[:shipping_trends][:spend_data]} %>
        </div>
      </div>
    </section>
  </section>

My current thought is to be a controller called charts_controller.rb This would contain all of the logic for each of the charts and have a view or partial the corresponds with a method and then load in via Ajax each one of those views.

class ChartsController < ApplicationController

  before_filter :authenticate_user!, :company_id

  def service_level
   #logic for service_level graph
   respond_to do |format|
     format.html
     format.js
   end
  end

end

for example I'm new to working with Ajax inside of rails and am not sure how to go about doing this. Does this approach make sense?

Upvotes: 0

Views: 74

Answers (1)

richjhall18
richjhall18

Reputation: 125

You could "draw" the charts in a partial on the server side. If you are using jQuery then you could use the jQuery.load function:

$('#graph-div').load('/my_restful_route');

The controller would have something like:

render partial: 'chart_partial'

Upvotes: 1

Related Questions