Rails with simple_form : link_to_add를 사용하여 새 테이블 행 추가

Question

link_to_add 함수 링크를 클릭하여 새 테이블 행을 추가하는 데 문제가 있습니다.

Answer 1

검색을 수행하고 & 오류를 찾으려고하면 오류가 발생합니다. 그 핵심은 새 필드 세트를 삽입 할 위치에 jquery selector (data-association-insertion-node)를 정의 할 수있는 nathanvda (nested_form 대신 ryanb)의 cocoon gem을 사용하는 것이 었습니다. 나의 예제에서는 HAML과 Twitter Bootstrap 코드를 사용하고 있지만 쉽게 자신의 즐겨 찾기로 바꿀 수 있습니다.

/app/views/users/_form.html.haml

:

= simple_form_for @user, :html => {:class => "form-horizontal"} do |f| 
    = render "shared/error_messages", :target => @user 
    .row-fluid 
    .span12 
     .fieldset 
     = f.input :username, :label => "Username:", :placeholder => "Username" 

     %table.table 
      %thead 
      %tr 
       %th 
       %i.icon-calendar 
       Date 
       %th 
       %i.icon-pencil 
       Description 
       %th 
       %i.icon-cog 
       Action 
      %tbody#user_events 
      = f.simple_fields_for :user_events do |event| 
       = render "user_event_fields", :f => event 

     = link_to_add_association f, :user_events, :"data-association-insertion-node" => "tbody#user_events", :"data-association-insertion-method" => "append", :partial => "user_event_fields", :class => "btn" do 
      %i.icon-plus 
      Add new event 

     %p.help-block 
      %strong Please note: 
      Events are only removed after confirming the changes with 
      %span.label 
      %i.icon-ok 
      Update settings! 

     = f.button :submit, :class => "btn" do 
      %i.icon-ok 
      Update settings! 

/app/views/users/_user_event_fields.html.haml :

%tr.nested-fields 
    %td= f.input_field :date, :as => :date_month_year, :class => "tooltip-bottom input-small", :rel => "tooltip", :title => "Date of event", :disabled => params[:action] == "show" 
    %td= f.input_field :description, :placeholder => "Description", :class => "input-large tooltip-bottom", :rel => "tooltip", :title => "Description of event<br/>Use <strong>Markdown</strong> to format your text.", :disabled => params[:action] == "show" 
    %td= f.input_field :label, :placeholder => "Label", :class => "input-medium tooltip-bottom", :rel => "tooltip", :title => "Label of event", :disabled => params[:action] == "show" 
    %td= f.input_field :label_class, :collection => [["Green", "label-success"], ["Yellow", "label-warning"], ["Red", "label-important"], ["Blue", "label-info"], ["Black", "label-inverse"]], :include_blank => "Grey", :class => "input-small tooltip-bottom", :rel => "tooltip", :title => "Label color of event", :disabled => params[:action] == "show" 
    %td 
    = link_to_remove_association f, :class => "btn" do 
     %i.icon-remove 

제거 링크가 작동하는 태그에 .nested-fields 클래스가 필수적이므로주의 해주십시오.