title: Gon variable is not defined in js.erb file using ajax
body: <p>I have a highchart that is being rendered by a <code>js.erb</code> file in conjunction with the <code>gon</code> variable. The setup that I have is that a user will load a page and once the page is ready an ajax call will be made to a separate controller. The controller will handle the data needed, assign it to gon and will render the appropriate <code>js.erb</code> file with the data. However, I keep observing that <code>gon</code> is consistently undefined and the variables are not being sent to <code>gon</code>. I wonder if this has to do with ajax but here is my code and logic flow.</p>
  
  <p>Here is where the call originates</p>
  
  <pre><code>_vulnerabilites_per_version.html.haml
  
  %script{:src =&gt; "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"}
  = Gon::Base.render_data
  
  
  - vanity_url = project.vanity_url
  :javascript
    $(document).ready(function() {
      $.ajax({
        url: "/p/#{vanity_url}/security.js"
      });
    })
  
  #vulnerabilities{:style =&gt; "max-width: 405px; height: 300px; margin: 0 auto"}
  </code></pre>
  
  <p>The call goes then to the controller</p>
  
  <pre><code>class VulnerabilitiesController &lt; ApplicationController
  
    before_action :set_project_or_fail
    before_action :set_best_project_security_set
    before_action :set_releases
    before_action :set_vulnerabilities
  
    def vulnerabilities_per_version
      gon.watch.release_versions = @releases.map { |r| r.version }
      puts gon.release_versions
    end
  
    private 
  
    def set_project_or_fail
      project_id = params[:project_id] || params[:id]
      @project = Project.by_vanity_url_or_id(project_id).take
      raise ParamRecordNotFound unless @project
    end
  
    def set_best_project_security_set
      @best_project_security_set = @project.best_project_security_set
    end
  
    def set_releases
      @releases = @best_project_security_set.releases.order(released_on: :asc).limit(10)
    end
  
    def set_vulnerabilities
      @vulnerabilities = Array.new(3) { [] }
      @releases.each do |r|
        @vulnerabilities[0] &lt;&lt; r.vulnerabilities.low.count
        @vulnerabilities[1] &lt;&lt; r.vulnerabilities.medium.count
        @vulnerabilities[2] &lt;&lt; r.vulnerabilities.high.count
      end
    end
  end
  </code></pre>
  
  <p>As you can see, the release_versions variable is being passed to <code>gon</code> and I can view it in the logs that the values that I am looking for are there.</p>
  
  <p>Once we leave the controller, the <code>js.erb</code> file is rendered:</p>
  
  <pre><code>vulnerabilites_per_version.js.erb
  
  alert(gon.watch.release_versions)
  
  $(function () {
      $('#vulnerabilities').highcharts({
          chart: {
              type: 'column'
          },
          title: {
              text: 'Vulnerabilities per Version',
              align: 'left',
              style: {
                  color: '#336699',
                  fontSize: 16
              }
          },
          legend: {
              align:  'left',
            itemWidth: 127
          },
          xAxis: {
              categories: gon.release_versions
          },
          yAxis: {
              min: 0,
              title: {
                  text: 'Vulnerabilities'
              },
  
              .........code.....
  </code></pre>
  
  <p>What could be the cause of this problem? Why am I unable to access the data in my <code>js.erb</code> file? According to the <code>gon</code> documentation, I should have everything set in order for the data to render yet it doesn't. As a second attempt, I also proceeded to read up on the <code>gon.watch</code> usage but again no luck. Any ideas? Help on the matter would greatly be appreciated.</p>