Кокон не добавляет / удаляет поля во вложенной форме - PullRequest
Новая
       90

Кокон не добавляет / удаляет поля во вложенной форме

0 голосов
/ 23 апреля 2020

Я создаю форму, в которой я могу добавлять / удалять дозы для коктейля. Я использую Cocoon Gem, но при нажатии «добавить / удалить дозу» в браузере ничего не происходит, при нажатии «добавить» новые поля не появляются, а при нажатии «удалить» поле не удаляется. Я не знаю, почему я не могу заставить его работать.

Я считаю, что это может быть связано с JavaScript, но я не совсем уверен, как это исправить.

Часть моей формы: _create_edit_form. html .erb 

 <%= simple_form_for @cocktail do |f| %>
  <%= f.input :name, required: true %>
  <%= f.nested_fields_for :doses do |dose| %>
    <%= render '/cocktails/partials/doses_fields', f: dose %>
  <% end %>
  <div class="btn-group" role="group" aria-label="Basic example">
    <%= link_to_add_association 'add dose', f, :doses, partial: '/cocktails/partials/doses_fields', class: "btn btn-secondary" %>
    <%= f.button :submit, class: "btn btn-secondary" %>
  </div>
<% end %>

Моя часть: _doses_fields. html .erb 

<div class='nested-fields'>
  <div class="field">
    <%= f.text_field :description %>
  </div>
    <%= link_to_remove_association "remove dose", f %>
</div>

Макет моего приложения 

<!DOCTYPE html>
<html>
  <head>
    <title>RailsMisterCocktail</title>
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>

    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
    <%= javascript_include_tag :cocoon %>
  </head>

  <body>
    <%= render "layouts/partials/navbar" %>
    <div class="page-container">
      <%= yield %>
    </div>
  </body>
</html>

Моя заявка. js

import 'bootstrap';

require("@rails/ujs").start();
require("turbolinks").start();
require("@rails/activestorage").start();
require("channels");

// added for nested forms
require("jquery3");
require("jquery_ujs");
require("nested_form_fields");
require("cocoon");

Моя декларация. js

//= link_tree ../images
//= link_directory ../stylesheets .css
//= link cocoon.js

Модель коктейля 

class Cocktail < ApplicationRecord
  validates :name, uniqueness: true, presence: true

  has_many :doses, dependent: :destroy
  has_many :ingredients, through: :doses
end

Модель дозы 

class Dose < ApplicationRecord
  validates :description, presence: true
  belongs_to :cocktail
  belongs_to :ingredient
  validates :cocktail, uniqueness: { scope: :ingredient }
 end

JavaScript консоль ничего не выводит при нажатии кнопок

Спасибо

...