Search code examples
ruby-on-railsassociationsjoincocoon-gem

Join table Quantity with cocoon (has_many through)


I didn't find anything related to my problem. I have these models:

class Meal < ActiveRecord::Base
  has_many :meal_ingredients
  has_many :ingredients, through: :meal_ingredients
  accepts_nested_attributes_for :ingredients, :reject_if => :all_blank, :allow_destroy => true
  accepts_nested_attributes_for :meal_ingredients
end

class Ingredient < ActiveRecord::Base
  has_many :meal_ingredients
  has_many :meals, through: :meal_ingredients
end

class MealIngredient < ActiveRecord::Base
  belongs_to :meal
  belongs_to :ingredient
end

In the meal_ingredient model I have a quantity column and I want to let the user set this quantity when creating a new meal with many ingredients. To allow that, I used the cocoon gem. And that's when the problem comes: I must set the ingredient_id and the meal_id to build the association with the quantity but I just hit the database when submiting the "Create Meal" buttom. Part of the solution I thought is creating a fields_forinside the form and set an instance variable in the controller.
But how can I get these ids? I'm stuck.

class MealsController < ApplicationController
  before_action :set_meal, only: [:edit, :update, :show]
  autocomplete :ingredients, :name

  def index
    @meals = Meal.order(updated_at: :desc).paginate(:page => params[:page], :per_page => 4)
  end

  def show
  end

  def new
    @meal = Meal.new
    @qtd = MealIngredient.new
  end

  def create
    @meal = Meal.new(meal_params)
    @qtd = @meal.ingredients.map{|r| MealIngredient.new(quantity: params[:quantity], ingredient_id: r.id, meal_id: @meal)}
    if @meal.save
      flash[:success] = "Refeição criada com sucesso!"
      redirect_to meals_path
    else
      render :new
    end
  end

  def edit
  end

  def update
    if @meal.update(meal_params)
      flash[:success] = "Your meal was updated succesfully!"
      redirect_to meal_path(@meal)
    else
      render :edit
    end
  end

  private

    def meal_params
      params.require(:meal).permit(:name, :picture, ingredients_attributes: [:name, :unit, :carb, :prot, :fat])
    end


    def set_meal
      @meal = Meal.find(params[:id])
    end

end

This is what I got so far... I don't think the main problem is being caused by cocoon gem. I think it's about concepts...

The params

Parameters: {"utf8"=>"✓", "authenticity_token"=>"dTYOiz8+pwNfwt432qhy7Yuj0hSVksj0bsTzxp8vD6QaupIJueSO1ASDkwiOB92qCiLO33Ke61aUBGbyvGZJfA==", "meal"=>{"name"=>"tests", "ingredients_attributes"=>{"1449471543091"=>{"name"=>"uva", "unit"=>"und", "carb"=>"1", "prot"=>"1", "fat"=>"1", "_destroy"=>"false"}}}, "meal_ingredient"=>{"quantity"=>"14"}, "commit"=>"Create Meal"}

View _form.html.erb

<div class = "row">
  <div class= "col-md-10 col-md-offset-1">
    <%= simple_form_for(@meal) do |f| %>
      <%= f.error_notification %>
      <div class="form-inputs">
        <%= f.input :name %>
      </div>
      <h3>ingredientes</h3>
      <div id="ingredients">
        <%= f.simple_fields_for :ingredients do |ingredient| %>
          <%= render "ingredient_fields", :f => ingredient %>
        <% end %>
      </div>

      <div class="form-actions">
        <div><%= link_to_add_association 'adicionar ingrediente', f, :ingredients, :class => "btn btn-default" %></div>

        <div><%= f.button :submit, class: "btn btn-success" %></div>
      </div>
    <% end %>
  </div>
</div>

_ingredient_fields.html.erb

<%= render 'shared/errors', obj: @meal %>
<div class = "nested-fields">
  <table class= "table">
      <thead>
        <tr>
          <td>
            <%= f.label "Nome" %>
          </td>
          <td>
            <%= f.label "Unidade" %>
          </td>
          <td>
            <%= f.label "Carbo" %>
          </td>
          <td>
            <%= f.label "Prot" %>
          </td>
          <td>
            <%= f.label "Gordura" %>
          </td>
          <td>
            <%= f.label "Quantidade" %>
          </td>
          <td>
            <%= f.label "kcal" %>
          </td>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td scope="row" class="col-md-4">
            <%= f.text_field :name, required: true, class: "form-control" %>
          </td>
          <td class="col-md-2">
            <%= f.text_field :unit, required: true, class: "form-control" %>
          </td>
          <td class="col-md-1">
            <%= f.text_field :carb, required: true, :pattern => '^\d+(\.\d+)*$', title: "Apenas números separados por pontos", class: "form-control" %>
          </td>
          <td class="col-md-1">
            <%= f.text_field :prot, required: true, :pattern => '^\d+(\.\d+)*$', title: "Apenas números separados por pontos", class: "form-control" %>
          </td>
          <td class="col-md-1">
            <%= f.text_field :fat, required: true, :pattern => '^\d+(\.\d+)*$', title: "Apenas números separados por pontos", class: "form-control" %>
          </td>
          <td class="col-md-1">
            <%= fields_for @qtd do |f| %>
              <%= f.hidden_field :ingredient_id %>
              <%= f.number_field :quantity, required: true, :pattern => '^\d+(\.\d+)*$', title: "Apenas números separados por pontos", class: "form-control" %>
            <% end %>
          </td>          
          <td class="col-md-1">
          </td>
          <td class="col-md-1">
            <%= link_to_remove_association "remove item", f, :class => "btn btn-danger" %>
          </td>
        </tr>
      </tbody>
  </table>
</div>

Solution

  • Following this tutorial and looking at the cocoon's demo app. It was easy to solve my problem, although I actually don't know exactly what I did here the
    <%= link_to_add_association 'adicionar ingrediente', f, :meal_ingredients, 'data-association-insertion-node' => "#ingredients ol", 'data-association-insertion-method' => "append", :wrap_object => Proc.new {|quantity| quantity.build_ingredient; quantity }, :class => "btn btn-default" %>
    I hate coding this way but this time I just went with the flow very carefully...
    If someone has already used cocoon for that purpose and can explain better I - and the community - would appreciate :D
    Changes made:
    Model

    class MealIngredient < ActiveRecord::Base
      belongs_to :meal
      belongs_to :ingredient
      accepts_nested_attributes_for :ingredient, :reject_if => :all_blank
    end
    

    Controller

    class MealsController < ApplicationController
      before_action :set_meal, only: [:edit, :update, :show]
      autocomplete :ingredients, :name
    
      def index
        @meals = Meal.order(updated_at: :desc).paginate(:page => params[:page], :per_page => 4)
      end
    
      def show
      end
    
      def new
        @meal = Meal.new
      end
    
      def create
        @meal = Meal.new(meal_params)
        if @meal.save
          flash[:success] = "Refeição criada com sucesso!"
          redirect_to meals_path
        else
          render :new
        end
      end
    
      def edit
      end
    
      def update
        if @meal.update(meal_params)
          flash[:success] = "Your meal was updated succesfully!"
          redirect_to meal_path(@meal)
        else
          render :edit
        end
      end
    
      private
    
        def meal_params
          params.require(:meal).permit(:name, :picture, :tcarb, :tprot, :tfat, :tkcal, meal_ingredients_attributes: [:quantity, ingredient_attributes: [:id, :name, :unit, :carb, :prot, :fat, :_destroy]])
        end
    
    
        def set_meal
          @meal = Meal.find(params[:id])
        end
    
    end
    

    Views
    _form.html.erb

    <div class = "row">
      <div class= "col-md-10 col-md-offset-1">
        <%= simple_form_for(@meal) do |f| %>
          <%= f.error_notification %>
          <div class="form-inputs">
            <%= f.input :name %>
          </div>
          <h3>ingredientes</h3>
          <fieldset id="ingredients">
            <ol>
              <%= f.fields_for :meal_ingredients do |meal_ingredient| %>
                <%= render "meal_ingredient_fields", :f => meal_ingredient  %>
              <% end %>
            </ol>
    
            <div class="form-actions">
              <div><%= link_to_add_association 'adicionar ingrediente', f, :meal_ingredients, 'data-association-insertion-node' => "#ingredients ol", 'data-association-insertion-method' => "append", :wrap_object => Proc.new {|quantity| quantity.build_ingredient; quantity }, :class => "btn btn-default" %></div>
            </div>
          </fieldset>
          <div class="form-actions">
            <div><%= f.button :submit, class: "btn btn-success" %></div>
          </div>
        <% end %>
      </div>
    </div>
    

    _meal_ingredient_fields.html.erb

    <div class = "nested-fields">
      <table class= "table">
          <thead>
            <tr>
              <td>
                <%= f.label "Nome" %>
              </td>
              <td>
                <%= f.label "Unidade" %>
              </td>
              <td>
                <%= f.label "Carbo" %>
              </td>
              <td>
                <%= f.label "Prot" %>
              </td>
              <td>
                <%= f.label "Gordura" %>
              </td>
              <td>
                <%= f.label "Quantidade" %>
              </td>
              <td>
                <%= f.label "kcal" %>
              </td>
            </tr>
          </thead>
          <tbody>
            <tr>
              <%= f.fields_for :ingredient do |fi| %>
              <td scope="row" class="col-md-4">
                <%= fi.text_field :name, required: true, class: "form-control" %>
              </td>
              <td class="col-md-2">
                <%= fi.text_field :unit, required: true, class: "form-control" %>
              </td>
              <td class="col-md-1">
                <%= fi.text_field :carb, required: true, :pattern => '^\d+(\.\d+)*$', title: "Apenas números separados por pontos", class: "form-control" %>
              </td>
              <td class="col-md-1">
                <%= fi.text_field :prot, required: true, :pattern => '^\d+(\.\d+)*$', title: "Apenas números separados por pontos", class: "form-control" %>
              </td>
              <td class="col-md-1">
                <%= fi.text_field :fat, required: true, :pattern => '^\d+(\.\d+)*$', title: "Apenas números separados por pontos", class: "form-control" %>
              </td>
              <% end %>
              <td class="col-md-1">
                <%= f.number_field :quantity, required: true, :pattern => '^\d+(\.\d+)*$', title: "Apenas números separados por pontos", class: "form-control" %>
    
              </td>          
              <td class="col-md-1">
              </td>
              <td class="col-md-1">
                <%= link_to_remove_association "remove item", f, :class => "btn btn-danger" %>
              </td>
            </tr>
          </tbody>
      </table>
    </div>