为什么带有 ajax 的模态不能正确关闭？

【问题标题】：why modal with ajax does not close correctly?为什么带有 ajax 的模态不能正确关闭？
【发布时间】：2018-01-15 23:11:13
【问题描述】：

我需要帮助，我尝试了很多方法（其中几个在论坛中，但什么都没有）

在索引中，我有一个 link_to，我在其中打开模式，下面是具有模式 id 的 div。

index.html.erb

<%= link_to 'Nuevo equipo', new_team_path, {class:"btn btn-success",:remote => true, 'data-toggle' =>  "modal", 'data-target' => '#modal-window-new' } %>
...
<div id="modal-window-new" class="modal hide fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div> 

new.js.erb

<% @tipo = 'Nuevo Equipo'
  js = escape_javascript(
  render(partial: 'teams/form', locals: {  team: @team  })
) %>
$("#modal-window-new").html("<%= js %>");

_form.html.erb

<div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
          <h5 class="modal-title" ><%= @tipo %></h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
           <span aria-hidden="true">&times;</span>
       </div>
       <%= form_for team, remote: true do |form| %>
       <div class="modal-body">

        <%= form.label  "Obligatorio (*)", class: "col-form-label" %>
         <div class="modal-body">
            <% if team.errors.any? %>
            <div class="form-group">
              <strong><%= pluralize(team.errors.count, "error/es") %> antes de agregar un equipo:</strong><br>
                <% team.errors.full_messages.each do |message| %>
                  <%= message %><br>
                <% end %>
              </div>
            <% end %>
          </div>

        <div class="form-group">
          <%= form.label :nombre_equipo, "Nombre Equipo*", class: "col-form-label" %>
          <%= form.text_field :nombre_equipo, class: "form-control",  id: :team_nombre_equipo %>
        </div>

        <div class="form-group">
          <%= form.label :ciudad_equipo, "Ciudad Equipo*", class: "col-form-label" %>
          <%= form.text_field :ciudad_equipo, class: "form-control", id: :team_ciudad_equipo %>
        </div>

        <div class="form-group">
          <%= form.label :restriccion_horario, "Restricción Horario", class: "col-form-label" %>
          <%= form.text_field :restriccion_horario, class: "form-control", id: :team_restriccion_horario %>
        </div>

        <div class="form-group">
          <%= form.label :camiseta, class: "col-form-label" %>
          <%= form.text_field :camiseta, class: "form-control", id: :team_camiseta %>
        </div>

        <div class="form-group">
          <%= form.label :pantaloneta, class: "col-form-label" %>
          <%= form.text_field :pantaloneta, class: "form-control", id: :team_pantaloneta %>
        </div>

        <div class="form-group">
          <%= form.label :medias, class: "col-form-label" %>
          <%= form.text_field :medias, class: "form-control", id: :team_medias %>
        </div>

        <script>
          $(document).ready(function() {
          $("select#team_select").select2();
          }); </script>

        <div class="form-group">
            <%= form.label :delegate_id, "Delegado:*" %>
         <%#= form.select(:delegate_id, Delegate.all, :id, :nombre, {include_blank: "None"}, {id: "team_select"}) %>
         <%= collection_select(:team, :delegate_id, Delegate.all, :id, :nombre_del_completo, {:multiple => false, :include_blank => true}, {class: "form-control", id: "team_select"})%><br><br>
        </div>

       </div>
       <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
        <%= form.submit "Guardar", class: "btn btn-success"%>
       </div>
       <% end %>
    </div>
</div>

他尝试了

  $('#modal-window-new').modal('hide');

模式绝不会关闭，因为我们已经在服务器上安装了应用程序。

非常感谢！

------------------------------------------ --

升级

update.js.erb

<% if not @team.errors.any? %>
  $('#modal-window-new').modal('hide');
  console.info($('#modal-window-new'));
<% else %>
  <% @tipo = 'Editar Equipo'
    js = escape_javascript(
    render(partial: 'teams/form', locals: {  team: @team  })
  ) %>
  $("#modal-window-edit").html("<%= js %>");
<% end %>

【问题讨论】：

• 当你试图关闭模式时，你需要在一个事件中完成它，比如点击某个元素或链接$('.close-button').click(function(){ $('#modal-window-new').modal('hide'); })
• 你能告诉我们他在哪里使用'$('#modal-window-new').modal('hide');' ?在 create.js 或 update.js 中？我也在使用它并且它正在工作。你能添加一个console.info($('#modal-window-new'));在声明之后，然后在您的 Firebug oder Inspector Console 中查看输出是什么？
• 我已经尝试放置点击按钮的事件，但没有任何反应，不知道是因为我放置事件的位置还是其他原因
• 我检查了我的文件：尝试
• 好的。我理解正确吗？您不是 Rails 开发人员并试图在生产中解决问题？如果那是正确的，那么我不能推荐这个！请不要。关于您的问题，我将添加更长的答案。