javascript - 在 Rails 中动态选择项目

标签 javascript jquery ruby-on-rails ruby-on-rails-3

我正在尝试使用rails和jquery在这里进行动态选择。代码如下

<div class = "line_items">  

<%- calc = Hash[Item.all.map{|p| [p.id, p.quantity]}].to_json %>

<div class = "item"><%= f.collection_select :item_id,Item.all,:id,:title, :prompt => "Select a Item", input_html: {data:{calc: calc} %></div>

   <div class ="quantity"> <%= f.text_field :quantity %></div>
/*rest  of code*/
</div>

View 的javascript如下

jQuery(document).ready(function(){
    jQuery('.item').bind('change',function() {
    var selectElement = jQuery(this);
    var  itemSelected = jQuery('.item:selected').val();
    var wrapperDivElement = selectElement.parent(".line_items");
    var quantity= eval(selectElement.data("calc"))[itemSelected];
    jQuery(".quantity", wrapperDivElement).val(quantity);
  });
});

当我更改项目时,出现以下错误 eval(selectElement.data("calc"))[itemSelected] 在 firebug 中未定义。谁能指出我哪里出错了?还有更好的方法来获取数量。我觉得我现在做的方法很粗暴。任何指导都会有所帮助。提前致谢。

最佳答案

jQuery(document).ready(function(){
    jQuery('.item select').bind('change',function() {
    var selectElement = jQuery(this);
    var  itemSelected = selectElement.val();
    var wrapperDivElement = selectElement.parents(".line_items");
    var quantity= eval(selectElement.data("calc"))[itemSelected];
    jQuery(".quantity input", wrapperDivElement).val(quantity);
  });
});

我猜想 itemSelected 的值没有被检测到,因此出现错误。上面重新定义的代码应该可以工作。但我强烈建议您不要获取这样的数据。最好进行 json 调用或 ajax 调用来从 Controller 获取相关数据。并在代码中使用 parents 代替 parent:)

关于javascript - 在 Rails 中动态选择项目,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12003734/

相关文章:

javascript - 仅在正则表达式匹配上应用 Bootstrap 弹出窗口

javascript - 数组中的映射在 ngOnChange 事件 Angular 5 中不起作用

jquery - 在没有唯一 ID 的 div 标签中隐藏文本

javascript - 如何将输入的长度设置为 8 或 14 个字符长?

ruby-on-rails - rails 引擎 : get parent app's name

javascript - Expressjs - 全局对象

javascript - Vue动态添加详情内容行的方式

jquery - 当页面滚动时如何使用 id 更改菜单的事件类别

ruby-on-rails - 三元运算符 ruby

javascript - rails : Turbolinks back to top of page