Проблемы с вложенной формой.Кнопка отправки отображается вне формы - PullRequest
0 голосов
/ 17 декабря 2018

В моем приложении есть объект под названием Album, который может содержать несколько медиа-файлов.

Это мои модели:

Class Album < ApplicationRecord

  belongs_to :user
  has_many :photos,dependent: :destroy

  has_many :media
  accepts_nested_attributes_for :media

class Media < ApplicationRecord
  mount_uploader :file_name, MediaUploader
  belongs_to :album
end

Я использую nestedform для динамического добавления новогоСМИ в мой альбом.

Это мои файлы просмотра:

form.html.erb
        <%= form_for @album do |f| %>
           <div class="col-9">
             <div class="form-group row" >
               <div class="col-6">
                <label for="">Name:</label>
                <%= f.text_field :name %>
              </div>
             </div>
           </div>

          <div class="col-9">
             <div class="form-group row" >
                <div class="col-6">
                    <%= render 'shared/media_uploader', media_contents: @media_contents, f:f %>
                </div>      
             </div>
          </div>
          <div class="col-9">
              <div class="actions">
                  <%= f.submit 'Save Album', class: 'btn btn-lg btn-solid-green btn-block bottom-7 mobile-bottom-3' %>
              </div>
          </div>
          <div class="col-9">
              <div class="actions">
                  <%= link_to "Delete Album", @album, :method => :delete, :class => "btn btn-lg btn-solid-red btn-block bottom-7 mobile-bottom-3", :confirm => "Are you sure ?"%>
              </div>
          </div>
          <div class="col-9">
              <div class="actions">
                  <%= link_to 'Cancel', profile_edit_profile_albums_path, class: "btn btn-lg btn-outline-gray btn-block"%>
              </div>
          </div>
        <% end %>

И вот мой частичный:

<div class="dialog dialog-overlay" id="dialog-photos">

  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel">Add Photos to your Album</h4>
      </div>
      <div class="modal-body">
        <%= f.fields_for :medias do |p| %>
          <%= form_tag media_contents_path(@album, :album => @album), method: :post, class: 'dropzone form', id: 'media-dropzone' do %>
            <div class="fallback">
              <%= hidden_field_tag :album , "1" %>
              <%= file_field_tag 'media', multiple: true %>
            </div>
          <% end %>
        <% end %>
      </div>
      <div class="modal-footer">
        <button type="button" class="dialog-close btn-plain float-right"><i class="icon-close icon-margin-right"></i> Close</button>
      </div>
    </div>
  </div>
</div>

Проблема здесь в том, что, когда мое приложение отображается, кнопки "Сохранить альбом »,« Удалить альбом »и« Отменить », он отображается вне формы.

Поэтому, когда я пытаюсь нажать, например, кнопку «Сохранить», она не отправляет форму (потому что, конечно, она отображается вне тега формы при визуализации).

Что я здесь не так делаю?

...