在 Rails 上的 Ruby 应用程序中使用 jquery ajax 刷新并 text_field

Use jquery ajax in my Ruby on Rails app to refresh and text_field

我在 rails 上的 ruby 应用程序是为一家建筑公司申请的,其中一部分我有两个模型,一个称为 Item( rubro),另一个叫做 Budget。创建的每个项目都有自己的价格。在我的预算表格中,我可以选择使用嵌套表格添加不同的项目及其数量。在第一列中,我有一个 collection_select 与项目 ID 一起使用 select 要添加的项目,在第二列中,您完成了数量,在第三列中,想法是显示小计值(商品价格 * 数量)。

我的问题是 我怎样才能让 item_id 在 collection_select 中被 select 编辑以用于获取商品价格并显示(商品价格*数量)在小计中 text_field?

可以吗?我知道我可以使用 ajax 和 jquery 来完成,但我对这些还很陌生。 或者有人可以给我一些其他的方法吗?

这是我的表格的一部分,我想按照我说的去做: _form.html.erb

 <%= f.fields_for :budget_details, :wrapper => false do |form| %>
                <tr class="fields ">
                  <td class="col-md-4">
                    <div class="col-md-9"><%=form.collection_select(:rubro_id, Rubro.all, :id, :name, {prompt: 'Seleccionar'}, class: 'form-control tooltip-required')%></div>
                    <div class="col-md-1"><%= link_to "<i class=\"fa fa-plus\"></i>".html_safe, new_rubro_path, {:class => "btn btn-sm btn-flat bg-green ", :title => "Nuevo Rubro"} %> </div></td>
                  <td class="col-md-1"> </td>
                  <td class="col-md-2"> </td>
                  <td class="col-md-1"><%=form.number_field :quantity, class: 'form-control tooltip-required'%></td>
                  <td class="col-md-2"><%=form.number_field :subtotal, class: 'form-control', :readonly => true%></td>
                  <td class="col-md-1"><%=form.number_field :utility, class: 'form-control'%> </td>
                  <td class="col-md-1"><%=form.link_to_remove '<i class="fa fa-trash"></i>'.html_safe, class: 'btn btn-danger'%></td>
                  <br>
                </tr>
            <% end %>

我把这个放在我的 application.js (rubro = item)

$('#collection_select').change(function() {
    var rubro = this.val();
    var data = {
        'rubro_id': this.val(),
}
    $.ajax({
        type:"GET",
        url : 'rubros/rubro_price',
        data : data,
        success : function(response) {
            var quantity = $("#rubro_quantity").val();
            var price = response.price;
            $("#price").val(price);
            var subtotal_price = (quantity * price);
            $("#subtotal_price").val(subtotal_price);
        },
        error: function() {
            alert('Error');
        }
    });
});

和我的rubro_controller.rb

 def rubros_price
    @rubro = Rubro.find(params[:data])
  end

我在这里写伪代码,如果你能在这里提供你的代码,那么我可以帮助你。

Please read each line below and put your comments if you need more clarity.

Select your item from the select box as you said from "collection_select".
 Call the ajax for item price which you selected or you can take from your page if price presents anywhere.
  You will get the price in ajax response.
 Now you have "Item", "quantity" and "price"(from ajax response).
You can calculate subtotal (price * quantity) and fill text_box.

根据您的反馈,我按照上面的伪代码放置 ajax 代码:

$('#collection_select').change(function() {
  var item = this.val();
  var data = {
    'item_id': this.val();
    }
  $.ajax({
    type:"GET",
    url : "/item_price", /*Here in controller you can find price as per item id*/
    data : data,
    success : function(response) {
       var quantity = $("#item_quantity").val();
       var price = response.price;
       var subtotal_price = (quantity * price);
       $("#subtotal_price").val(subtotal_price);
    },
    error: function() {
        alert('Error occured');
    }
 });
});