【问题标题】:passing ruby arrays to javascript code (jquery) in a haml view in Ruby on Rails在Ruby on Rails的haml视图中将ruby数组传递给javascript代码(jquery)
【发布时间】:2012-04-14 23:07:00
【问题描述】:

我正在使用 jQuery/javascript 在 haml 模板上显示 Highcharts 图。这是一个 sn-p,显示了 HighCharts 站点中演示代码的独立图:

:javascript

  $(document).ready(function() {
    $("#tabs").tabs();
    new Highcharts.Chart({
      chart: {
        renderTo: 'volume_chart'
      },
      title: {
        text: 'Logarithmic axis demo'
      },
      xAxis: {
        tickInterval: 1
      },
      yAxis: {
        type: 'logarithmic',
        minorTickInterval: 0.1
      },
      tooltip: {
        headerFormat: '<b>{series.name}</b><br />',
        pointFormat: 'x = {point.x}, y = {point.y}'
      },
      series: [{            
        data: [1, 2, 4, 8, 16, 32, 64, 128, 256, 512],
        pointStart: 1
      }]
    });
  });

这很好用。现在我正在尝试从 show.html.haml 文件中的 ruby​​/rails 数组中设置系列数据,如下所示:

...
- data_array        = [1, 2, 4, 8, 16, 32, 64, 128, 256, 512]
...
:javascript

  $(document).ready(function() {
  ...
      series: [{            
        data: "#{data_array}",
        pointStart: 1
      }]
    });
  }); 

这给了我以下错误:

undefined method `to_js' for [1, 2, 4, 8, 16, 32, 64, 128, 256, 512]:Array

如何将我的 ruby​​/rails 代码中的 data_array 传递给 javascript/jquery 代码?

感谢任何帮助。

谢谢。

巴拉特

【问题讨论】:

    标签: javascript jquery ruby-on-rails ruby


    【解决方案1】:
    require 'json'
    
    ...
    
    "#{data_array.to_json}"
    

    【讨论】:

    • 谢谢。我独立发现了以下内容: 1. 不要将此数组命名为“数据”,因为这会干扰 jQuery 的远程数据传输机制。 2. 将此数组重命名为“test_array”后,我可以说出您上面所说的内容,即“#{test_array.to_json”或“#{test_array.inspect}”或只是“#{test_array}”,所有这些都有效。非常感谢您的宝贵时间。
    【解决方案2】:

    嘿,在 HAML 中不需要使用to_json

       :javascript
         $(document).ready(function() {
           ...
           series: [{            
             data: #{ruby_array},
             pointStart: 1
           }]
         });
        }); 
    

    完美的工作

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2017-04-24
      • 2013-07-05
      • 1970-01-01
      • 1970-01-01
      • 2012-06-26
      • 1970-01-01
      • 2021-07-23
      相关资源
      最近更新 更多