对RubyOnRails的Javascript查询

时间:2016-03-18 09:11:45

标签: javascript jquery ruby-on-rails-4

我想将j [3]值减去sell_price文本字段并在赢利/损失字段中显示结果,但它只在页面的第一行工作,下一行没有完美计算。

<script>
    function sm() {
      var txtFirstNumberValue = document.getElementById('txt1').value;
      var txtSecondNumberValue = document.getElementById('txt2').value;
      var result = parseFloat(txtFirstNumberValue) - parseFloat(txtSecondNumberValue);
       if(!isNaN(result))  {
      document.getElementById('txt3').value = result;
}
}
</script>
<%= form_for ProductionReport.new ,:url=>{:controller=>"users",:action=>"rate_per_unit_report" } do |i| %>
<% $rpu = @arr.sort_by{|i| i[1].to_i}.reverse%>
<% @arr.each do |j| %>
<tr>
<td><%=j[0]%></td>
<td><%=j[1]%></td>
<td><%=j[2]%></td>
<%@q=j[3]%>
<td><%=i.text_field j[3],:value=>@q,:id=>"txt1",:onkeyup=>"sm()",:class=>"txt",:readonly =>true%></td>
<td><%= i.text_field :selling_price,:id=>"txt2",:onkeyup=>"sm()",:class=>"txt"%></td>
<td><%= i.text_field :profit_loss,:id=>"txt3",:class=>"txt",:readonly =>true %></td>
<%end%>
<%end%>
</tr>
<tr>
<td>total</td>
<td><%=@total%></td>
<td><%=@total1%></td>
<td><%=@total2%></td>

Answer me........

1 个答案:

答案 0 :(得分:0)

如果你可以使用jquery的简单解决方案:

只需改变一下:

<td><%=i.text_field j[3],:value=>@q,:id=>"txt1",:onkeyup=>"sm()",:class=>"txt",:readonly =>true%></td>
<td><%= i.text_field :selling_price,:id=>"txt2",:onkeyup=>"sm()",:class=>"txt"%></td>
<td><%= i.text_field :profit_loss,:id=>"txt3",:class=>"txt",:readonly =>true %></td>

到此:

<td><%=i.text_field j[3],:value=>@q,:id=>"txt1",:onkeyup=>"sm()",:class=>"txt text1",:readonly =>true%></td>
<td><%= i.text_field :selling_price,:id=>"txt2",:onkeyup=>"sm()",:class=>"txt text2"%></td>
<td><%= i.text_field :profit_loss,:id=>"txt3",:class=>"txt text3",:readonly =>true %></td>

并将sm功能更改为:

<script>
        function sm() {
          var txtFirstNumberValue = $(this).closest('tr').find('.text1').val();
          var txtSecondNumberValue = $(this).closest('tr').find('.text2').val();
          var result = parseFloat(txtFirstNumberValue) - parseFloat(txtSecondNumberValue);
           if(!isNaN(result))  {
          $(this).closest('tr').find('.text3').val(result);
    }
    }
    </script>