Update fields using jquery and Gem Cocoon

Question

I’m using the Rails Cocoon for child form creation. When creating the child form, a field called Barcode is read and, via ajax, I receive the product information and fill in the form fields. This is working properly, however, while saving, the data is not persisted in the database. How to do this correctly ?

order.Rb

class Order < ActiveRecord::Base
   has_many :details, dependent: :destroy
   belongs_to :customer
   accepts_nested_attributes_for :details, :reject_if => :all_blank, :allow_destroy => true
   validates :customer_id,
             :presence => true
end

Details.Rb

class Detail < ActiveRecord::Base
   belongs_to :order
end

_form.html.erb

<%= simple_form_for(@order) do |f| %>
   <%= f.error_notification %>
   <div class="form-inputs">
     <div class="row">
       <div class="small-4 columns">
         <%= f.association :customer, collection:   Customer.order('nome ASC'), label_method: :nome, value_method: :id, include_blank: false, prompt: "Selecione", label: "Cliente:", class: "right inline cliente" %>
  </div>
  <div class="small-2 columns">
    <p>Valor Pedido:</p>
    <span class="valor_total"> R$ 0,00</span>
  </div>
  <div class="small-2 columns end">
    <p>Total Ítens:</p>
    <span class="item_total"></span>
  </div>
</div>
<%= f.input :valor_total, :as => :hidden, input_html: { class: 'valor_total_ror' } %>
<%= f.input :item_total, :as => :hidden, input_html: { class: 'item_total_ror' } %>
<%= f.input :order_num, :as => :hidden, input_html: { class: 'ordem_num_ror' } %>
<div class="row">
 <div class="small-12 columns">
 <hr/>
    <div class="itens">
          <div id="order_details">
            <%= f.simple_fields_for :details do |detail| %>
                 <%= render "detail_fields", :f => detail %>
               <% end %>
          </div>
    </div>
  </div>
</div>
<div class="row">
  <div class="small-12 columns">
    <div class="form-actions">
      <%= link_to_add_association '+', f, :details, :class => "button tiny radius" %><br />
    </div>
  </div>
</div>
<div class="row">
  <div class="small-2 columns end">
    <%= f.button :submit, "Salvar" %>
  </div>
</div>

_details_fields.html.erb

<div class="nested-fields">
<div class="row">
    <div class="small-3 columns end leitor">
        <form action="#" method="post">
                    Código de barras
                    (<a href="http://zxing.appspot.com/scan?ret=http://www.auere.com.br/testes/barcode.php?codigo={CODE}">Leitor</a>):
                    <input class = "cod_barras" type="text" name="cod_barras" value="" />
                </form>
    </div>
</div>
<div class="row">
<hr/>
  <%= f.input :order_id, :as => :hidden, input_html: { class: 'order_id_ror' } %>
  <div class="small-1 columns">
    <%= f.input :cod_produto, label: "Produto", input_html: { class: 'cod_produto_ror' } %>
  </div>
  <%= f.input :desc_produto,:as => :hidden, input_html: { class: 'desc_produto_ror' } %>
  <%= f.input :cod_cor,:as => :hidden, input_html: { class: 'cod_cor_ror' } %>
  <div class="small-2 columns">
    <%= f.input :desc_cor,label: "Cor", input_html: { class: 'desc_cor_ror' } %>
  </div>
  <div class="small-1 columns">
      <%= f.input :desc_tamanho,label: "Tam", input_html: { class: 'desc_tamanho_ror' } %>
  </div>
  <div class="small-2 columns">
      <%= f.input :preco,label: "Preço",input_html: { class: 'preco_ror' } %>
  </div>
  <div class="small-1 columns">
      <%= f.input :quantidade,label: "Qtd", input_html: { class: 'quantidade_ror' } %>
  </div>
  <div class="small-2 columns end">
      <%= f.input :total,label: "Total",input_html: { class: 'total_ror' } %>
  </div>
  <div class="small-1 columns end">
    <%= link_to_remove_association "-", f, :class => "button tiny alert" %>
  </div>
  <hr/>
</div>

order js.

jQuery(document).ready(function($)
{
$(document).on("focusout",".cod_barras",function()  {
  barcode = $(this).val();
  if (barcode === "") return;
    var parent = $(this).parents('.nested-fields');
    var cod_produto = $(parent).find('.cod_produto_ror');
    var desc_produto = $(parent).find('.desc_produto_ror');
    var cod_cor = $(parent).find('.cod_cor_ror');
    var desc_cor = $(parent).find('.desc_cor_ror');
    var desc_tamanho = $(parent).find('.desc_tamanho_ror');
    var input_preco = $(parent).find('.preco_ror');
    var input_qtd = $(parent).find('.quantidade_ror');
    var input_total = $(parent).find('.total_ror');
  $.ajax({
  type: "GET",
  url: "/consulta_produto",
  dataType: "json",
  data: { barcode: barcode},
  complete: function() {},
  success: function(response)
  {
        // Os valores estão sendo atribuidos corretamente
        // mas nao estão sendo salvos no banco de dados
        $(cod_produto).val(response.resultado.cod_produto);
        $(desc_produto).val(response.resultado.desc_produto);
        $(cod_cor).val(response.resultado.cod_cor);
        $(desc_cor).val(response.resultado.desc_cor);
        $(desc_tamanho).val(response.resultado.desc_tamanho);
        $(input_preco).val(response.resultado.preco);
        $(cod_produto).prop( "disabled", true );
        $(desc_produto).prop( "disabled", true );
        $(cod_cor).prop( "disabled", true );
        $(desc_cor).prop( "disabled", true );
        $(desc_tamanho).prop( "disabled", true );
        $(input_preco).prop( "disabled", true );
        $(input_total).prop( "disabled", true );
        $(input_qtd).focus();
  }
});
});
$(document).on("focusout",".quantidade_ror",function()  {
  quantidade_ror = $(this).val();
  if (quantidade_ror === "") return;
    var parent = $(this).parents('.nested-fields');
    var preco = $(parent).find('.preco_ror');
    preco_final = preco.val();
    var total = $(parent).find('.total_ror');
    $(total).prop( "disabled", true );
    var resultado = quantidade_ror * preco_final;
    $(total).val(resultado);
});
});