使用JavaScript变量红宝石代码

以我红宝石形式，使用JavaScript变量红宝石代码

$('#some_id').change(function(){ 
    var value = $(this).val(); 
    var index = $(this).attr('id').to_i; 

    $('option_value_0').html('<%= escape_javascript render partial: 'color_form', locals: { f: f, index: index, id: value } %>') 
})

内这是JavaScript部分。它会抛出错误，因为

未定义的方法索引和值。

我该如何解决这个问题？提前致谢。

来源

2016-01-19 Md.Mostafizur Rahman Sahed

红宝石在服务器上运行，JS在客户端上，所以两者不能直接交互。要做你需要的东西，你需要使用AJAX将你的JS变量发送到服务器。 –

Ce ne pas possible，mon ami。

作为评价所提到的，Ruby是服务器; javascript是客户端。这意味着两件事情之一：

构建的JavaScript运行时（不推荐）
发送AJAX/JavaScript值服务器（通过Ajax）

得到这个工作正确的，你需要通过ajax发送请求：

#app/assets/javascripts/application.js 
$(document).on("change", "#some_id", function(e) { 
    $.get("forms/update", {index: $(this).val(), value: $(this).attr('id').to_i}); 
});

这将需要通过适当的路由&控制器动作：

#config/routes.rb 
get "color_form", to: "application#color_form" 

#app/controllers/application_controller.rb 
class ApplicationController < ActionController::Base 
    respond_to :js, :html 

    def color_form 
    @id = params[:id] 
    @value = params[:value] 
    end 
end 

#app/views/application/color_form.js.erb 
$('option_value_0').html('<%=j render partial: 'color_form', locals: { index: @index, id: @value } %>')

是，这是啰嗦，但它是正确的方式。

如果您想要快捷方式，则可以预先加载color_form部分，然后使用javascript功能更改id或value参数。如果你愿意，我可以写这个。

预紧

如果你想做到这一点没有阿贾克斯，标准方式（包括modals，太）是部分添加到您的网页和“隐藏”了。

这样，你的JS有实际的HTML代码，无论是表演，或追加到页面的其他部分：

#view 
<div class="hidden"> 
    <%= render partial: 'color_form', locals: { f: f, index: "x", id: "y" } %> 
</div> 

#app/assets/javascripts/application.js 
$(document).on("change", "#some_id", function(e) { 
    $partial = $(".hidden").html(); 
    $partial.find("#id").html($(this).attr('id').to_i); 
    $partial.find("#index").html($(this).val()); 
    $('option_value_0').html($partial); 
});

来源

2016-01-19 11:06:52

感谢您的简要描述。这太好了！你能否介绍一下预加载'color_form'？谢谢！再次。 –

'preload'是什么意思？ –

你写道：'如果你想要快捷方式，你可以预先加载color_form部分，然后使用javascript功能来改变id或value params.'。那我该怎么做呢？ –

您无法使用JavaScript在HTML页面中注入ruby代码。在生成的HTML页面被发送到浏览器之前，在服务器上处理ERB模板。浏览器加载页面后，可以查看页面的源代码，但不会看到任何<%= ... %>标签，因为它们已由服务器呈现。

JavaScript已经在浏览器中添加了ruby代码，但浏览器不会理解ruby。

您可能希望查看支持部分（或模板）的JavaScript框架，例如AngularJS。

来源

2016-01-19 07:51:12 taglia

使用JavaScript变量红宝石代码

回答

相关问题