nested_form gem을 구현하는 방법은 무엇입니까?

Question

nested_form gem을 사용하여 레일에 중첩 된 양식을 구현하려고합니다. 중첩 필드를 표 형식으로 표시하려고합니다. 어느 누구도 나를 도울 수 있습니까?

<%= nested_form_for @invoice,url: invoices_path,method: :post do |f| %> 

<div class="row form-inline"> 
      <div class="col-lg-12"> 
       <ul id="sortable" class="append-table"> 
       <li class="table-responsive has-dropdown invoice-append"> 
       <div class="table items"> 
        <div class="table-head"> 
         <div class="th"></div> 
         <div class="th">#</div> 
         <div class="th">Name</div> 
         <div class="th">Description</div> 
         <div class="th">Quantity</div> 
         <div class="th">Item Price</div> 
         <div class="th">Total Price</div> 
         <div class="th">Taxable</div> 
         <div class="th"></div> 
         <div class="th"></div> 
        </div> 
        <div class="table-body ui-sortable"> 
         <%= f.fields_for :invoice_line_items do |ff| %> 
         <div class="tr item"> 
          <div class="td handle-cell"> 
          <div class="handle ui-sortable-handle"></div> 
          </div> 
          <div class="td display-order-cell"> 
           <div> 
           <div class="display-order">1</div> 
           </div> 
          </div> 

          <div class="td"> 
           <div class="form-group name-container"> 
            <span class="twitter-typeahead" style="position: relative; display: inline-block;"> 
             <input type="text" class="form-control typeahead name prevent-enter tt-hint" maxlength="200" disabled="" autocomplete="off" spellcheck="false" style="position: absolute; top: 0px; left: 0px; border-color: transparent; box-shadow: none; background: none 0% 0%/auto repeat scroll padding-box border-box rgb(255, 255, 255);"> 
             <%#= ff.text_field :name, class: "form-control typeahead name prevent-enter tt-input", placeholder: "Name",style: "position: relative; vertical-align: top; background-color: transparent;" %> 
             <input type="text" name="item0[name]" id="name" value="A" placeholder="Name" class="form-control typeahead name prevent-enter tt-input" maxlength="200" autocomplete="off" spellcheck="false" style="position: relative; vertical-align: top; background-color: transparent;" dir="auto"> 
             <pre aria-hidden="true" style="position: absolute; visibility: hidden; white-space: nowrap; font-family: azo-sans-web, Helvetica, Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 400; word-spacing: 0px; letter-spacing: 0px; text-indent: 0px; text-rendering: auto; text-transform: none;"></pre> 
             <span class="tt-dropdown-menu" style="position: absolute; top: 100%; left: 0px; z-index: 100; display: none;"> 
             <div class="tt-dataset-invoiceItemTemplatesAutocomplete"></div> 
            </span> 
            </span> 
           </div> 
          </div> 

          <div class="td"> 
           <div class="form-group description-container"> 
            <%= ff.text_area :description, class: "form-control", placeholder: "Description" %> 
            <!-- <textarea name="item0[description]" id="description" placeholder="Description" class="form-control description" maxlength="1000" style="overflow: hidden; word-wrap: break-word; resize: none; height: 60px;"></textarea> --> 
           </div> 
          </div> 

          <div class="td quantity-cell"> 
           <div class="form-group"> 
            <%= ff.text_field :quantity, class: "form-control", placeholder: "Qty" %> 
            <!-- <input type="text" name="item0[quantity]" id="quantity" value="5" placeholder="Qty" class="form-control quantity prevent-enter" size="5" maxlength="10"> --> 
           </div> 
          </div> 

          <div class="td original-price-cell"> 
           <div class="input-group"> 
            <div class="input-group-addon">₹</div> 
            <%= ff.text_field :price,class: "form-control", placeholder: "Item Price"%> 
            <!-- <input type="text" name="item0[original_price]" id="original_price" placeholder="Item Price" class="form-control original-price money-only prevent-enter" size="9" maxlength="9"> --> 
           </div> 
          </div> 

          <div class="td price-cell"> 
           <label class="price-display"></label> 
           <%= ff.hidden_field :total_price,class: "form-control price money-only" %> 
           <!-- <input type="hidden" name="item0[price]" id="price" placeholder="Price" class="form-control price money-only" size="9" maxlength="9"> --> 
          </div> 

          <div class="td is-taxable-cell"> 
           <div class="checkbox"> 
            <%= ff.check_box :is_taxable %> 
            <label class="optional" for="remember"></label> 
            </div> 
          </div> 

          <div class="td remove-cell"> 
          </div> 

          <div class="td save-invoice-item-template-cell"> 
           <a href="#" class="js-save-as-invoice-item-template">Save to Use Again</a> 
          </div> 
         </div> 
         <% end %> 
        </div> 
       </div> 
       </li> 
      </ul> 
      </div> 
     </div> 
     <div class="row"> 
     <div class="col-lg-12"> 
      <p><%= f.link_to_add "Add Item", :invoice_line_items, class: "btn btn-default" %></p> 
      <!-- <button type="button" class="btn btn-default add-item">Add Item</button> --> 
     </div> 
     </div> 
<% end %> 

이 구조는 테이블 구조 외부 중첩 된 필드를 추가 : 다음

내보기 파일입니다. <div class="table-body"> 내에 어떻게 추가 하시겠습니까?

Answer 1

중첩 된 양식에 대해 설명해주십시오. 중첩 된 형태를 구현하기위한 안내 ..clear