Ошибка реализации ajax из одного частичного в другой частичный в представлении

Question

У меня есть 2 контроллера: Приветствие (которое обрабатывает домашнюю страницу) и Приглашения (которые помогают людям создавать / управлять приглашениями).Я пытаюсь иметь на одной и той же welcome.html.erb обе части в представлении Приглашения: _form.html.erb (для создания приглашения) и _results.html.erb (для отображения приглашений через Ajax на одной странице welcome.html.erb).У меня также есть create.js.erb в папке просмотра приглашения.Входные данные работают хорошо, но обновления в реальном времени нет.Мне все еще нужно обновить страницу.Кто-нибудь знает, что я делаю не так, пожалуйста?

_form.html.erb код:

<h3 class="section_title"> Express meeting request IR </h3>
<div id="theform">
<%= simple_form_for invitation do |f| %>
  <%= f.error_notification %>
  <%= f.error_notification message: f.object.errors[:base].to_sentence if f.object.errors[:base].present? %>
  <%= f.label "Dest." %>
  <%= f.collection_select(:guest_id, User.all, :id, :full_name, {}, class: "selectpicker", title: "Choose recipient", multiple: true, data: {style: "form-control", size: "200", width: "100%"})  %>

  <br><br>
  <%= f.input :event_id %>
    <%= f.input :start %>
    <%= f.input :title %>
    <%= f.input :type_of_event %>
    <%= f.label "Memo" %> <br>
    <%= f.text_area :memo,  as: :text, class: "text_area_iro", rows: 5 %>

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

_result.html.erb (определенный заголовок таблицы удален) выглядит так:

<% @invitationsR.each do |invitation| %>
          <tr>
            <td><%= find_name(invitation.user_id) %></td>
            <td><%= invitation.start %></td>
            <td><%= TypeEvenement.find_by(id: invitation.type_of_event).type_name %> </td>         </tr>
        <% end %>

create.js.erb выглядит так:

$("#theform").html("<%= escape_javascript(render :partial =>  'invitations/result', :locals => {:invitation => @invitation}) %>");

Welcome.html.erb выглядит как

<%= render :partial =>  'invitations/form', :locals => {:invitation => Invitation.new} %>
<%= render :partial =>  'invitations/result', :locals => {:invitations => @invitations} %>

Контроллер, как обычно, имеет простые методы new и create.Метод создания выглядит следующим образом:

def create
    @listmail = params[:invitation][:guest_id]
    @listmail = @listmail.join(' ').split

    @listmail.each do |v|
      @invitation = current_user.invitations.build(invitation_params)
      @invitation.guest_id = v
      puts(v)
      @invitation.save!
    end

    if @invitation.save
      redirect_to invitations_path
    else
      render 'new'
    end

  end

Answer 1

1 => Добавить удаленный :remote=> true, чтобы разрешить отправку формы через ajax-запрос.

<%= simple_form_for invitation, id: "invitation_form", :remote=> true do |f| %>
  ###Content
<%end%>

2 => Обернуть частичный результат в отдельный идентификатор как: -

<%= render :partial =>  'invitations/form', :locals => {:invitation => Invitation.new} %>
<div id "result_partial">
  <%= render :partial =>  'invitations/result', :locals => {:invitations => @invitations} %>
</div>

3 => Всегда полезно использовать локальную переменную (приглашения вместо @invitations) в частичном, то есть

In _result.html.erb

<% invitations.each do |invitation| %>
  <tr>
    <td><%= find_name(invitation.user_id) %></td>
    <td><%= invitation.start %></td>
    <td><%= TypeEvenement.find_by(id: invitation.type_of_event).type_name %> </td>  
  </tr>
<% end %>

4 => Рефакторинг действия создания (т. Е. Всегда использоватьв каком формате вы должны отвечать в html или js)

def create
  @listmail = params[:invitation][:guest_id]
  @listmail = @listmail.join(' ').split

  @listmail.each do |v|
    @invitation = current_user.invitations.build(invitation_params)
    @invitation.guest_id = v
    puts(v)
    if @invitation.save!
      @invitations = current_user.invitations #get all invitations  including new invitations  that has been saved just now
      respond_to do |format|
        format.html{ redirect_to invitations_path }
        format.js { render :layout => false }
      end
    else
      window.location = "http://localhost:3000/invitations.new";
    end
  end
end

5 => После ответа

$('#invitation_form').[0].reset(); #reset form
$("#result_partial").html("<%= j render partial: 'invitations/result', :locals => {:invitation => @invitation}) %>"); #Refresh only results

Answer 2

Следующий код работает для очистки формы после проверки Ajax:

$("#result_partial").html("<%= j render partial: 'invitations/result', :locals => {:invitation => @invitation} %>");
$("#result2_partial").html("<%= j render partial: 'invitations/result2', :locals => {:invitation => @invitation} %>");

$("#theform").remove();
$('#invitation_form').html("<%= j render partial: 'invitations/form', :locals => {:invitation => Invitation.new}  %>");

Только не забудьте сбросить элементы select2 с помощью:

  $(document).ready(function(){$('#invitation_guest_id').select2({
        placeholder: "Contact name, list or company",
        minimumInputLength: 3
    });
    });

Answer 3

У вас есть опечатки и пропущенные очки.В вашем методе создания вам нужно определить переменную экземпляра с именем @invitations, которую вы передадите в парциальную переменную как локальную переменную в create.js.erb файле:

def create
    ---- skip code ----
      @invitation.save!
    end

    @invitations = current_user.invitations # define this one 

    if @invitation.save
    ---- skip code ----

  end

Теперь, когда вы определили переменную, таким образом вcreate.js.erb файл будет:

$("#theform").html("<%= escape_javascript(render :partial =>  'invitations/result', :locals => {:invitations => @invitations}) %>");

In _result.html.erb:

<% invitations.each do |invitation| %>
    ## Content
<% end %>