Estoy aprendiendo a trabajar con Ruby on Rails 5, específicamente los nested forms con una relación many to many. Quisiera agregar un botón para poder agregar N número de registros usando un modal de bootstrap. En este caso telefonos(Telephone) a otro modelo que es contactos (Contact). algo como se muestra en la imagen.
He hecho algunas pruebas pero ninguna ha sido exitosa. Mis asociaciones ya las realice de manera correcta, pero mi problema esta en los formularios, no se exactamente como hacerlo
Por el momento esto es lo que tengo
_form.html.erb
<div class="row">
<div class="col-10 offset-1 text-center">
<%= form_with(model: contact, local: true) do |form| %>
<% if contact.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(contact.errors.count, "error") %> prohibited this contact from being saved:</h2>
<ul>
<% contact.errors.full_messages.each do |message| %>
<li><%= message %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="form-row">
<%= form.fields_for :contacts do |con| %>
<div class="form-group col">
<%= form.label :company_id, "Empresa" %>
<%= form.collection_select(:company_id, Company.all, :id, :emp_nombre, prompt: 'Selecciona una empresa', class: "form-control") %>
</div>
<%end%>
<%= form.fields_for :departments do |con| %>
<div class="form-group col">
<%= form.label :department_id, "Departamento" %>
<%= form.collection_select(:department_id, Department.all, :id, :dep_nombre, prompt: 'Selecciona un departamento', class: "form-control") %>
</div>
<%end%>
</div>
<div class="form-row">
<div class="form-group col-1">
<%= form.label :con_titulo, "Título" %>
<%= form.text_field :con_titulo, id: :contact_con_titulo, class: "form-control" %>
</div>
<div class="form-group col-6">
<%= form.label :con_nombre, "Nombre" %>
<%= form.text_field :con_nombre, id: :contact_con_nombre, class: "form-control" %>
</div>
<div class="form-group col">
<%= form.label :con_puesto, "Puesto" %>
<%= form.text_field :con_puesto, id: :contact_con_puesto, class: "form-control" %>
</div>
<div class="form-group col">
<%= form.label :con_sexo, "Sexo" %>
<%= form.text_field :con_sexo, id: :contact_con_sexo, class: "form-control" %>
</div>
</div>
<hr>
<h3 class="display-5">Telefonos:</h3>
<table class="table">
<thead>
<tr>
<th>Telefono</th>
<th>Tipo</th>
<th></th>
</tr>
</thead>
<tbody>
<% contact.telephones.each do |tel| %>
<%= tel.tel_numero%>
<% end %>
</tbody>
</table>
<div class="form-row">
<%= form.fields_for :telephones do |tel| %>
<div class="form-group col">
<%= tel.label :tel_numero, "Telefono" %>
<%= tel.text_field :tel_numero, id: :tel_numero, class: "form-control"%>
</div>
<div class="form-group col">
<%= tel.label :tel_tipo, "Tipo" %>
<%= tel.text_field :tel_tipo, id: :tel_numero, class: "form-control"%>
</div>
<% end %>
</div>
<hr>
<div class="form-group">
<%= form.label :con_observacion, "Comentarios" %>
<%= form.text_field :con_observacion, id: :contact_con_observacion, class: "form-control" %>
</div>
<div class="actions">
<%= form.submit "Guardar", class: "btn btn-primary" %>
</div>
<% end %>
</div>
</div>
contacts_controller.erb
class ContactsController < ApplicationController
before_action :set_contact, only: [:show, :edit, :update, :destroy]
# GET /contacts
# GET /contacts.json
def index
@contacts = Contact.all
end
# GET /contacts/1
# GET /contacts/1.json
def show
end
# GET /contacts/new
def new
@contact = Contact.new
@telephone = Telephone.new
@contact.telephones.build
end
# GET /contacts/1/edit
def edit
end
# POST /contacts
# POST /contacts.json
def create
@contact = Contact.new(contact_params)
respond_to do |format|
if @contact.save
format.html { redirect_to @contact, notice: 'Contact was successfully created.' }
format.json { render :show, status: :created, location: @contact }
else
format.html { render :new }
format.json { render json: @contact.errors, status: :unprocessable_entity }
end
end
end
# PATCH/PUT /contacts/1
# PATCH/PUT /contacts/1.json
def update
respond_to do |format|
if @contact.update(contact_params)
format.html { redirect_to @contact, notice: 'Contact was successfully updated.' }
format.json { render :show, status: :ok, location: @contact }
else
format.html { render :edit }
format.json { render json: @contact.errors, status: :unprocessable_entity }
end
end
end
# DELETE /contacts/1
# DELETE /contacts/1.json
def destroy
@contact.destroy
respond_to do |format|
format.html { redirect_to contacts_url, notice: 'Contact was successfully destroyed.' }
format.json { head :no_content }
end
end
private
# Use callbacks to share common setup or constraints between actions.
def set_contact
@contact = Contact.find(params[:id])
end
# Never trust parameters from the scary internet, only allow the white list through.
def contact_params
params.require(:contact).permit(:con_nombre, :con_titulo, :con_puesto, :con_sexo, :con_observacion, :company_id, :department_id, telephones_attributes:[:id, :tel_numero, :tel_tipo])
end
end
contact.erb
class Contact < ApplicationRecord
has_many :companies
belongs_to :company
has_and_belongs_to_many :telephones
accepts_nested_attributes_for :telephones
end
Telephone.erb
class Telephone < ApplicationRecord
has_one :company
has_and_belongs_to_many :contacts
end
De momento todo funciona bien pero quisiera tener la fila de telefonos que se agregue cada que doy "+", para poder almacenar N números de telefono
De ante mano muchas gracias