Javascript计算未在rails嵌套表单内触发

我在rails应用程序中使用嵌套的表单。我需要在嵌套表单中添加onchange事件。每次添加新行并在“数量”文本字段中输入值时，该值应与先前添加行的“数量”字段一起添加。增加的值应显示在“总计”文本字段中。目的是在total字段中查找数量和显示的总和。此脚本应适用于嵌套表单中添加的每一新行。有人请帮忙。提前谢谢

我的档案

My application.js

和my_form.html.erb

根据文件

此gem仅适用于Rails 3。有关插件，请参见rails2分支 在Rails 2中工作

---

嵌套表单仅适用于rails 3，但您使用的是rails 5

它适用于rails 3和版本4。我目前也在使用Rails 5，不过，gem不再维护了。我看不到任何新的提交，最后一次提交是从2013年开始的。你最好用别的宝石。您可以使用cocoon。您是否记住，添加的每个嵌套元素都有一个唯一的ID？您是否尝试过嵌套：字段添加：普通菜单？

gem 'rails', '~> 5.0.2'
gem 'pg', '~> 0.18'
gem 'puma', '~> 3.0'
gem "responders"
gem "active_model_serializers", github: "rails-api/active_model_serializers"
gem 'date_validator'
gem 'axlsx_rails'
gem 'carrierwave', '~> 1.0'
gem 'jquery-ui-rails'   
gem "select2-rails"
gem 'bootstrap', '~> 4.0.0.alpha6'
gem 'font-awesome-sass', '~> 4.7.0'
gem 'will_paginate', '3.1.5'
gem "nested_form"
gem 'yaml_db'
gem 'sass-rails', '~> 5.0'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.2'
gem 'jquery-rails'
gem 'turbolinks', '~> 5'
gem 'jbuilder', '~> 2.5'

//= require jquery
//= require jquery_ujs
//= require select2
//= require jquery_nested_form
//= require turbolinks
//= require jquery-ui
//= require bootstrap
//= app
//= vendor
//= require_tree .

<%= nested_form_for(normalmenu_site) do |f| %>
     <%= f.text_field :total, readonly: true, class: "tot" %>
     <table class="table table-container" id="tasks">  
        <thead>
          <th>Quantity/Per Head</th>      
          <th>Action</th>    
        </thead>  
        <tbody>
          <%= f.fields_for :normal_menus ,wrapper:false  do |ff| %>
            <tr class="fields">              
            <td><%= ff.text_field :quantity, class: "dt" %></td>      
            <td><%= ff.link_to_remove "".html_safe,:class=>"fa fa-trash-o "%></td>      
            </tr>      
          <%end%>
           <%= f.link_to_add "".html_safe, :normal_menus,:class=>"fa fa-plus ", :data => { :target => "#tasks" } %>  
        </tbody>
      </table>
   <% end %>

<script type="text/javascript">
  $(document).on('nested:fieldAdded', function(event){
    var field = event.field;
    var total = ($(".tot").val());
    var roleField = field.find('.dt');
    $(".dt").keyup( function() {
      alert(roleField.val());
      var total += roleField.val();
    });
  })
</script>