0

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.

formulario de prueba

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

1
  • Agrega a tu pregunta el código que no te está funcionando, además de explicar que funciona y que no, y así podrás recibir más ayuda. el 7 mar. 2018 a las 13:29

1 respuesta 1

0

Ya tengo la solución, lo que estaba buscando era lo que ofrece la Gema Cocoon. Solo seguí tal cual los pasos que se mencionan en la documentación oficial (importante el uso de jquery!)

Les comparto el link de la gema https://github.com/nathanvda/cocoon

y este tutorial tambien me fue muy útil https://www.sitepoint.com/better-nested-attributes-in-rails-with-the-cocoon-gem/

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.