Question

I’ve been knocking my head against a wall here for a few hours trying to solve this with no luck. I’m using Ruby, Haml, Sinatra, and Highcharts. I’ve created a Ruby HighCharts object that interpolates a Haml partial containing only the :javascript filter followed by the necessary HighChart JS.

This works fine when I test it in the base route (“/”). The JQuery, Highcharts, and inline JS from the partial loads just fine and the chart is rendered successfully.

But when I put the IDENTICAL code in another route (e.g. “/user/:id”) and appropriate view, the chart is not rendered. Using Firebug, I can see that Jquery, Highcharts, and appropriate JS from the partial load correctly and the Ruby variables are interpolated exactly as they are when I put this code in the base route. So the JS fed to the browser is identical, but the chart is only rendered when I put this in the base route.

One thing that might help diagnosis: on the “user/:id” page, when I inspect the external Jquery and Highchart scripts with Firebug in Chrome, it says “Access to restricted URI denied.” But when I inspect those scripts on the the base page (“/”), it shows the full javascript text. On both pages when I inspect the Ruby interpolated inline Highcharts JS, it shows the full text.

Maybe the Jquery and Highcharts external scripts aren’t loading correctly on the “user/:id” page? Any idea what the problem might be?

Here’s my layout haml file, in case it’s helpful for diagnosing the problem:

!!!  
%html  
  %head  
    %title= @title
    %link(rel="stylesheet" href="/style.sass")
    %script{:src => "javascripts/jquery-1.6.2.js"}
    %script{:src => "javascripts/js/highcharts.js"}
  %body
    #framecontent
      .innertube
        #nav  
          %ul
            %li
              %a(href="/") Home
            %li
              %a(href="senate") Users

#maincontent
  .innertube
    - if flash[:notice]
      %p.notice
        = flash[:notice]
    - if flash[:error]
      %p.error
        = flash[:error]
    =yield

Answer 1

Why don’t you use the src in at the root level:

%script{:src => "/javascripts/jquery-1.6.2.js"}
%script{:src => "/javascripts/js/highcharts.js"}

this should work at any level