将变量传递给escape_javascript

Question

这会传递字符串git checkout A git read-tree -m -u C git commit --no-edit -c C 而不是== productID的变量。我怎样才能传递变量，而不是字符串？

5

也尝试过：

<script>
$(document).ready(function(){
    $(".test").click(function(){
      var productID = 5;
      $("#productModal").html("<%= escape_javascript(render 'layouts/modal', :product_id => "productID").html_safe %>"); 
      $("#modal").modal();
    });
});
</script>

这也只是输出$("#productModal").html("<%= escape_javascript(render 'layouts/modal', :product_id => " + productID + ").html_safe %>"); 而不是+ productID +

Answer 1

如果您想修改自己提供的代码，最好执行以下操作：

<script>
$(document).ready(function(){
    $(".test").click(function(){
      var productID = 5;
      $("#productModal").html("<%=j render('layouts/modal', product_id: " + productID + ").html_safe %>"); 
      $("#modal").modal();
    });
});
</script>

然而此代码存在几个大问题。

<强>不唐突的

首先，为什么使用<script>代码？

这表明你已经把它放在一个视图中，这是非常糟糕的做法。

最有效的方法是使用unobtrusive javascript模式，这是Rails asset pipeline能够支持的模式：

#app/assets/javascripts/application.js
$(document).on("click", ".test", function(e) {
    var productID = 5;
    $("#productModal").html(productID); 
    $("#modal").modal();
});

这不仅意味着您可以在整个应用程序中使用此代码（模块化），还可以确保您能够调用正确的

-

<强>辅助

其次，您会注意到我已排除上面的escape_javascript代码。

这是因为资产管道无法处理ERB / Rails代码。

Javascript是客户端; Rails是服务器端的。

这很重要，因为当你调用render等时 - 你的javascript将无法执行此操作，除非它从服务器调用，特别是如果部分需要在DOM上设置的变量负荷。

为此，您需要使用ajax：

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

#app/controllers/application_controller.rb
class ApplicationController < ActionController::Base
   def modal
      @productID = params[:product_id]
      respond_to do |format|
         format.js { render "layouts/modal", product_id: @productID }
      end
   end
end

#app/assets/javascript/application.js
$(document).on("click", ".test", function(e) {
   var productID = 5;
   $.get("modal", {product_id: productID}, function(data) { 
      $("#productModal").html(data); 
      $("#modal").modal();
   });
});

这里的一个小警告是，如果您将.erb附加到JS文件（javascripts/application.js.erb），则您将能够使用render。但是，在调用文件时，这只能 ;因此将任何变量传递给部分将不起作用。

<强>更新

这里最终有效：

#app/assets/javascripts/application.js
$(document).on("click", ".testinggg", function(e) { 
   var productID = 5; 
   $.get("modal", {product_id: productID}, function(data){ 
     $("#productModal").html(data); 
     $("#modal").modal(); 
   }, "html"); 
});