Question

我有一个要求，我们必须添加两个文本字段并在第三个中插入存储为字符串的值。在下面的表格中，我想将数量和price_per_unit相乘，并将值存储在total_amount字段中，该字段应该是只读的。请帮帮我。

这是我的表格：

<%=form_for([:invoice_detail,@multiple_good], html: {class: 'form-horizontal', role: 'form' }) do |f| %>

    <div class="field">
      <%= f.label :description_of_goods, :class => 'control-label' %>
      <div class="controls">
        <%= f.text_field :description_of_goods, :class => 'text_field', :required => true,:maxlength => 20, :placeholder => '20 Alpha numeric characters'  %>
      </div>
    </div>

    <div class="field">
      <%= f.label :quatity, :class => 'control-label' %>
      <div class="controls">
        <%= f.text_field :quatity, :class => 'text_field', :required => true,:maxlength => 20, :placeholder => 'Enter quatity'  %>
      </div>
    </div>

    <div class="field">
      <%= f.label :price_per_unit, :class => 'control-label' %>
      <div class="controls">
        <%= f.text_field :price_per_unit, :class => 'text_field', :placeholder => 'Enter price Per unit'  %>
      </div>
    </div>

    <div class="field">
      <%= f.label :total_amount, :class => 'control-label' %>
      <div class="controls">
        <%= f.text_field :total_amount, :class => 'text_field', :placeholder => 'Enter Total Amount '  %>
      </div>
    </div>

    <div class="form-actions2"style="text-align:center">
      <%= f.submit  :class => 'btn btn-primary' %>
    </div>
    </div>

<% end %>

Answer 1

有多种方法可以做到这一点。

支持，数据库中只有一列total_amount，您可以在模型中使用attr_accessor，然后before_save，您可以设置total_amount。

如果你想要它像一个实时的东西，那么你需要JS，这很容易。你可以

<%= f.text_field :quatity, class: "text-field", id: "quantity" ... %>
<%= f.text_field :price_per_unit, class: "text-field", id: "price-per-unit" ... %>"
<%= f.text_field :total_amount, class: "text-field", id: "total-amount" .. readonly: true %>

然后在JS中，

$(document).on("change", "#quantity #price", function() {
  var price = $("#price").val() || 0,
      quantity = $("#quantity").val() || 0;
  $("#total-amount").val(price * quantity);
});

但是我会说那会很糟糕，因为我可以轻松地使用web-inspector来删除readonly并自己设置值。但是如果你有price和quantity作为数据库字段，那么你不必担心其他人在服务器端保持验证。

Answer 2

尝试使用此JS添加两个文本字段并在第三个文本字段中显示总值，此JS将自动更新文本字段中的总金额而无需单击。

$(document).on("keyup", "#quantity, #price", function() {
  var price = $("#price").val();
  var quantity = $("#quantity").val();
  var total = parseInt(price) * parseInt(quantity);
  $("#total-amount").val(total);
});

谢谢。

Answer 3

<script type='text/javascript'>
$(document).on("keyup", "#item_cgst, #item_sgst", function() {
var val1 = +$("#item_cgst").val();
var val2 = +$("#item_sgst").val();
$("#item_igst").val(val1+val2); 
});
</script>

试试这个对我有用..

如何在rails表单的第三个文本字段中添加两个文本字段值？

3 个答案: