ROR-coffeescript导致“ Uncaught ReferenceError”

Question

The error I am getting is puzzling as I copied some working code from one controller/views /javascript making name changes and took out lines to get an initial working version. The revelvant part of the coffeescript file causing the run time error is below.

app/assets/javascripts/companies.js.coffee

...
calculateResult = (company_id)-> 
  data = $('#x_company_drill_interests').serialize()
  console.log(" -01- in calculateResult ")
  console.log data
  $.ajax
    url:"/companies/#{company_id}/projection.json",
    type:"post"
    dataType: 'json'   # data type of response
    data: data
    failure: (data,success,xhr)->
       console.log(" -01- in calculateResult - Failure ")
       console.log data
    success: (data,success,xhr)->
       console.log("-01- in calculateResult - SUCCESS ")
       company_listings_block = $ '#x_company_listings_results .infogroup-body'
       head_row = $ '''
<tr>
  <th>Company</th>
</tr>
'''
      table = $ '<table border="0" cellpadding="0" cellspacing="5"></table>'
      table
        .addClass('info')
        .append(head_row)
      for result in data
        name = result.display_name
        result_row = $ """
<tr>
  <td>#{name}</td>
</tr>
"""
        table.append result_row
      eval_result_block.html('').append table

Produces the error :

uncaught ReferenceError: head_row is not defined

Which is caused by the line .append(head_row) . If I remove this line I get this error Uncaught ReferenceError: eval_result_block is not defined .

Also for some reason I can't get code to use the Post route. This is how I add to amend the routes file.

config/rutes.rb

resources :companies, only: [:destroy, :update] do
  member do
    get 'companies_drill_interests'
    match 'projection', via: [:get,:post, :patch]
  end
end

For reference here is the working code I copied from

calculateResult = (drill_id)->
  console.log("  -001- in calculate results")
  data = $('#x_evaluation_assumption_params').serialize()
  $.ajax
    url:"/drills/#{drill_id}/projection.json",
    type:"post"
    dataType: 'json'   # data type of response
    data: data
    failure: (data,success,xhr)->
      console.log("     -001- in Calculate Result - Failure ")
      console.log data
    success: (data,success,xhr)->
      # console.log("     -001-     print data from call")
      eval_result_block = $ '#x_id_evaluation_results .infogroup-body'
      head_row = $ '''
<tr>
  <th>Company</th>
  <th>Price</th>
  <th>Mkt Cap</th>
  <th>Discovery Value</th>
  <th>Target Price</th>
  <th>Leverage</th>
  <th>Risked Lev </th>
  <th>Leverage with CFD's</th>
</tr>
'''
      table = $ '<table border="0" cellpadding="0" cellspacing="5"></table>'
      table
        .addClass('info')
        .append(head_row)
      for result in data
        if !(result.listing.option_unlisted) 
          name = result.display_name
          share_price = '$' +
            NumberHelpers.number_with_precision((result.listing.share_price/1000), {separator: '.', precision: 3, delimiter: ','})
          market_capitalisation_mill = '$' +                 
             NumberHelpers.number_with_precision((result.market_capitalisation/1000000), {separator: '.', precision: 1, delimiter: ','}) + 'M'
          discovery_value = '$' + 
            NumberHelpers.number_with_precision(result.discovery_value_total, {separator: '.', precision: 0, delimiter: ','})
          discovery_value_per_share = '$' + 
            NumberHelpers.number_with_precision((result.target_share_price), {separator: '.', precision: 2, delimiter: ','})
          leverage = 
        NumberHelpers.number_with_precision(result.leverage, {separator: '.', precision: 0, delimiter: ','}) + '%'
      risked_leverage =  
            NumberHelpers.number_with_precision(result.risked_leverage, {separator: '.', precision: 0, delimiter: ','}) + '%'
          leverage_with_CFD = 
            NumberHelpers.number_with_precision(result.leverage_with_CFD, {separator: '.', precision: 0, delimiter: ','}) + '%'
          result_row = $ """
<tr>
  <td>#{name}</td>
  <td>#{share_price}</td>
  <td>#{market_capitalisation_mill}</td>
  <td>#{discovery_value}</td>
  <td>#{discovery_value_per_share}</td>
  <td>#{leverage}</td>
  <td>#{risked_leverage}</td>
  <td>#{leverage_with_CFD}</td>
</tr>
"""
        table.append result_row
      eval_result_block.html('').append table

Answer 1

In the first code, eval_result_block is not defined before it is used. About result_row , in the first part of the code in it is into a for loop, and in the other part of the code it is outside this for loop because of risked_leverage has a different indent, 4 spaces shorter. That means it is outside of the for loop, so, that is why result_row is outside too.

In coffeescript, indent matter. If you put 3 spaces instead of 2, generated code will be different. Look at your code:

failure: (data,success,xhr)->
   console.log(" -01- in calculateResult - Failure ")
   console.log data
success: (data,success,xhr)->
   console.log("-01- in calculateResult - SUCCESS ")
   company_listings_block = $ '#x_company_listings_results .infogroup-body'
   head_row = $ '''

If different of

failure: (data,success,xhr)->
  console.log(" -01- in calculateResult - Failure ")
  console.log data
success: (data,success,xhr)->
  console.log("-01- in calculateResult - SUCCESS ")
  company_listings_block = $ '#x_company_listings_results .infogroup-body'
  head_row = $ '''

Because in the first case there 3 spaces, and in hte second one there is 2 spaces.

Here your code with a correct indent. and by reading your code I'am thinking that result_row and table.append result_row have to be in the for loop.

calculateResult = (company_id)-> 
  data = $('#x_company_drill_interests').serialize()
  console.log(" -01- in calculateResult ")
  console.log data
  $.ajax
    url:"/companies/#{company_id}/projection.json",
    type:"post"
    dataType: 'json'   # data type of response
    data: data
    failure: (data,success,xhr)->
      console.log(" -01- in calculateResult - Failure ")
      console.log data
    success: (data,success,xhr)->
      console.log("-01- in calculateResult - SUCCESS ")
      company_listings_block = $ '#x_company_listings_results .infogroup-body'
      head_row = $ '''
<tr>
  <th>Company</th>
</tr>
'''
      table = $ '<table border="0" cellpadding="0" cellspacing="5"></table>'
      table
        .addClass('info')
        .append(head_row)
      for result in data
        name = result.display_name
        result_row = $ """
<tr>
  <td>#{name}</td>
</tr>
"""
        table.append result_row
      company_listings_block.html('').append table

You can try to compile each part of code into javascript, it will help you to understand what happen. Coffee compiler