表单构造操作视图中的茧宝石回调

时间:2019-06-04 17:39:32

标签: javascript ruby ajax ruby-on-rails-5 cocoon-gem

当使用茧形宝石创建表单时,插入新的茧形时,我可以通过调用“ cocoon:插入后”回调来检测动作。

然后我用它替换id的元素,以利用另一个javascript函数计算用户在另一个字段中输入的百分比。

但是当我使用update操作重新打开表单时,将重新定义茧。这不会导致回调“ cocoon:插入后”。重置ID,一一插入

我想知道在返回表单进行编辑时是否存在捕获回调的方法。这样我就可以检测到并重新绘制新的ID

当它创建茧的新实例时,我在“ form.html.erb”中使用此代码替换ID。

var i = 0;
$(document).on('cocoon:after-insert', function (e) {
    i++;
    var id_drop_down_product = 'id_drop_down_product' + i;
    $(this).find("#id_drop_down_product").attr('id', id_drop_down_product);
});

我认为在构建表单进行编辑时会起作用


这是我的代码,叫茧,一切也都在起作用

<div class="form-group">
  <%= form.fields_for :pedido_produtos do |builder| %>
    <% render partial: "shared/pedido_produto_fields", locals: {f: builder} %>
  <% end %>
  <%= link_to_add_association('Produto', form, :pedido_produtos, class: "btn btn-outline-success") %>
</div>


<div class="nested-fields">
  <div class="order_product">
    <div class="form-group col-md-12">
      <%= f.collection_select(:product_id, Product.all, :id, :nome, {:prompt => "Selecione um Product"}, {:class => 'form-control', onchange: "searchProduct($(this).val(),this.id);", id: "dropselectProduct", :required => true}) %>
      <%= f.text_field :quantity, class: "form-control", id: "quantityproducty", :required => true, onchange: "update_discount($(this).val(),this.id);" %>
      <%= f.text_field(:porcent, class: "form-control", id: "porcent", readonly: true) %>
    </div>
    <%= link_to_remove_association('Del.', f, class: "btn btn-outline-danger") %>
  </div>
</div>

在视图中,我有一个字段,用于获取产品的值和百分比字段的值(由用户选择),并计算产品新值的百分比。

但是在此视图中,您可以插入多个产品,然后执行此操作。

图片视图示例: https://ibb.co/s3Z43yk

0 个答案:

没有答案