Rails选择表单:提交之前显示并使用选择表单的值吗?

时间:2018-12-21 12:47:15

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

我正在为下订单流程设计多步骤表单。在其中,我有两个用于运输国家和运输服务的选择器。选择国家/地区后,将显示给定地点和重量的所有运输服务。下订单后,所有内容都会写入模型。所有运输详细信息过程都是通过紧随Ryan Bates #217 Multistep Forms

之后的多步骤表单完成的

选择了运送国家/地区后,通过javascript ajax调用填充了运送服务选择器。我遵循了这两个教程Dynamic select boxes with Rails 4Dependent country city state

$(document).on("change", "#lands_select", function(event){
  $.ajax({
    url: "/carts/update_shipping/" + event.target.value,
    type: "GET"
  })
});

update_shipping.js.erb

$("#shippingservices_select").empty()
  .append("<%= escape_javascript(render(:partial => @shippingservices)) %>");

_shippingservice.html.erb

<option value="<%= shippingservice.id %>"><%= shippingservice.name.titleize %></option>

除此之外,我还要在表格下方显示与两个选择器中的选择相关的运输费用以及计算出的总运输费用。

在购物车模型中计算购物车的小计成本,在订单模型中计算订单的成本。

我该怎么做?由于两个值都尚未写入订单数据库,因此我必须显示第二个选择器选择的结果价格,该价格位于运输服务表内,但是由于订单已被写入,但我无法通过订单实例调用它变量。我的猜测是我必须适应ajax调用才能做到这一点,是吗?我该怎么做?

据我所知,据我所知,表单是通过订单控制器的update_shipping动作生成的json填充的。

谢谢!

1 个答案:

答案 0 :(得分:2)

您可以在数据属性中传递该列:

<option value="<%= shippingservice.id %>" data-cost="<%= shippingservice.cost %>"><%= shippingservice.name.titleize %></option>

然后通过JS这样显示

$(document).on("change", "#shippingservices_select", function(event){
  var cost = $(event.target).data('cost');
  $("#some_cost_div").html(cost);
  // maybe add to total etc.
});