ruby on rails - coccoon: change where added form field is rendered -


i have form uses coccoon dynamically add form fields. problem styling. form fields being added in wrong spot. here code:

<div class="col-md-5>     <!--content here !--> </div> <div class="col-md-2">     <!-- more content here !--> </div> <%= form_for @owner |f| %>     <div class="col-md-4">         <%= f.fields_for :cars |car| %>             <%= render 'cars_fields', :f => car %>         <% end %>          <div class="row text-center center-block">             <%= f.submit "send", class: 'btn btn-default' %>         </div>       </div>     <div class="col-md-1">         <%= link_to_add_association f, :cars, class: 'btn bgm-cyan btn-float waves-effect' %>             <i class="md md-add"></i>         <% end %>     </div> <% end %> 

here code of partial car_fields:

<div class="form-group" style="padding: 10px 40px;" >     <%= f.text_field :make, class: 'form-control input-sm', placeholder: "car make"%> </div> 

i want link_to_add_association button to right of form. when pressed, want new form field appear inside col-md-4. instead, appearing below of content on page. how make new form field appear inside col-md-4? think has data-association-insertion-node or data-association-insertion-method documentation has been difficult.

from documentation https://github.com/nathanvda/cocoon

data-association-insertion-node : jquery selector of node. default: parent node

data-association-insertion-method : jquery method inserts new data. before, after, append, prepend, etc. default: before

data-association-insertion-traversal : jquery traversal method allow node selection relative link. closest, next, children, etc. default: absolute selection

so using default traversal method absolute , can go this

<%= form_for @owner |f| %> <div id="place-to-insert" class="col-md-4">     <%= f.fields_for :cars |car| %>         <%= render 'cars_fields', :f => car %>     <% end %>      <div class="row text-center center-block">         <%= f.submit "send", class: 'btn btn-default' %>     </div>   </div> <div class="col-md-1">     <%= link_to_add_association f, :cars, class: 'btn bgm-cyan btn-float waves-effect0', data: {association_insertion_method: "append", association_insertion_node: "#place-to-insert"} %>         <i class="md md-add"></i>     <% end %> </div> 

Comments

Popular posts from this blog

python - pip install -U PySide error -

arrays - C++ error: a brace-enclosed initializer is not allowed here before ‘{’ token -

cytoscape.js - How to add nodes to Dagre layout with Cytoscape -