在轨道表内的嵌套窗体(茧宝石)

问题描述:

我忙于一个发票应用程序,我试图从茧宝石内嵌<tbody></tbody>嵌套窗体。嵌套表格可以很好地工作,但它不会显示在<tbody></tbody>中,而是在桌面上方的某个随机位置。我认为这是因为你不能在桌子内部有<div class=nested-fields></div>,但我不知道如何以不同的方式做到这一点。在轨道表内的嵌套窗体(茧宝石)

enter image description here

我有这个在我的发票/ _form.html.erb:

<%= form_for @invoice do |f| %> 
<% if @invoice.errors.any? %> 
    <div id="error_explanation"> 
     <h2><%= pluralize(@invoice.errors.count, "error") %> prohibited this invoice from being saved:</h2> 

     <ul> 
     <% @invoice.errors.full_messages.each do |message| %> 
     <li><%= message %></li> 
     <% end %> 
     </ul> 
    </div> 
    <% end %> 
     <div class="row"> 
      <div class="col-sm-12"> 
      <table class="table table-striped"> 
       <thead> 
       <tr> 
       <th class="hidden-480"> Hoeveelheid </th> 
       <th class="hidden-480"> Beschrijving </th> 
       <th class="hidden-480"> Bedrag </th> 
       <th class="hidden-480"> Totaal </th> 
       <th class="hidden-480"> Btw(%) </th> 
       </tr> 
       </thead> 
       <tbody> 
       <%= f.fields_for :products do |product| %> 
       <%= render 'product_fields', f: product %> 
       <%= link_to_add_association 'Item toevoegen', f, :products, class: 'btn btn-primary btn-success' %> 
       <% end %> 
       </tbody> 
      </table> 
      </div> 
     </div> 
    <% end %> 

发票/ _product_fields.html.erb

<div class="nested-fields"> 
    <tr> 
     <td> <%= f.text_field :quantity %> </td> 
     <td> <%= f.text_area :description %> </td> 
     <td> <%= f.number_field :unitprice %> </td> 
     <td> €200 </td> 
     <td> <%= f.select(:btw, [[' 21%', 21, title: '21%'],[' 6%', 6, title: '6%'], [' 0%', 0, title: '0%']]) %> </td> 
    </tr> 
    <%= link_to_remove_association 'x', f, class: 'btn btn-primary btn-danger' %> 
</div> 

发票。 rb - 型号

class Invoice < ActiveRecord::Base 

    has_one :company 
    has_one :customer 
    has_many :products 

    accepts_nested_attributes_for :customer, reject_if: :all_blank, allow_destroy: true 
    accepts_nested_attributes_for :products, reject_if: :all_blank, allow_destroy: true 
    validates :number, :currency, :date, :duedate, :btwtotal, :subtotal, :total, presence: true 

end 

Product.rb - 模型

class Product < ActiveRecord::Base 

belongs_to :invoice 


end 

Invoices_controller.rb

class InvoicesController < ApplicationController 
    before_action :set_invoice, only: [:show, :edit, :update, :destroy] 

    # GET /invoices 
    # GET /invoices.json 
    def index 
    @invoices = Invoice.all 
    end 

    # GET /invoices/1 
    # GET /invoices/1.json 
    def show 
    end 

    # GET /invoices/new 
    def new 
    @invoice = Invoice.new 
    @invoice.products.build 
    end 

    # GET /invoices/1/edit 
    def edit 
    end 

    # POST /invoices 
    # POST /invoices.json 
    def create 
    @invoice = Invoice.new(invoice_params) 

    respond_to do |format| 
     if @invoice.save 
     format.html { redirect_to @invoice, notice: 'Invoice was successfully created.' } 
     format.json { render :show, status: :created, location: @invoice } 
     else 
     format.html { render :new } 
     format.json { render json: @invoice.errors, status: :unprocessable_entity } 
     end 
    end 
    end 

    # PATCH/PUT /invoices/1 
    # PATCH/PUT /invoices/1.json 
    def update 
    respond_to do |format| 
     if @invoice.update(invoice_params) 
     format.html { redirect_to @invoice, notice: 'Invoice was successfully updated.' } 
     format.json { render :show, status: :ok, location: @invoice } 
     else 
     format.html { render :edit } 
     format.json { render json: @invoice.errors, status: :unprocessable_entity } 
     end 
    end 
    end 

    # DELETE /invoices/1 
    # DELETE /invoices/1.json 
    def destroy 
    @invoice.destroy 
    respond_to do |format| 
     format.html { redirect_to invoices_url, notice: 'Invoice was successfully destroyed.' } 
     format.json { head :no_content } 
    end 
    end 

    private 
    # Use callbacks to share common setup or constraints between actions. 
    def set_invoice 
     @invoice = Invoice.find(params[:id]) 
    end 

    # Never trust parameters from the scary internet, only allow the white list through. 
    def invoice_params 
     params.require(:invoice).permit(:number, :currency, :date, :duedate, :btwtotal, 
             :subtotal, :total, :footer, customers_attributes: [:id, :company_name, :address_line_1, :zip_code, :_destroy], 
             companies_attributes: [:id, :btw_number, :iban_number, :kvk_number, :company_name, :_destroy], 
             products_attributes: [:id, :quantity, :description, :unitprice, :btw, :total]) 
    end 
end 

任何想法是怎么回事?帮助将非常感谢!

+0

什么是f的对象?你能证明f来自哪里以及模型中的关联吗? –

+0

新增所有内容,感谢您的帮助! – luissimo

您可以参考控制cocoon gem的插入行为部分以获取有关插入嵌套字段的更多参考。

例如,

$(document).ready(function() { 
    $("#owner a.add_fields"). 
     data("association-insertion-method", 'append'). 
     data("association-insertion-traversal", 'closest'). 
     data("association-insertion-node", '#parent_table'); 
}); 

可以简单地使用内置的茧创业板link_to_add_association提供的方法,

参考: https://github.com/nathanvda/cocoon#link_to_add_association

<%= link_to_add_association 'Item toevoegen', f, :products,:"data-association-insertion-node" => "tbody#{id of tbody encapsulating your fields_for}",:"data-association-insertion-method" => "append", class: 'btn btn-primary btn-success' %> 

PS这是我的第一个答案stackoverflow,所以我提前道歉,如果我不够清楚。