Question

我可以在DOM中获取要渲染的模态，但我无法让它显示，我让它瞬间闪现，但它不会停留。这是相关的代码。

tasks_controller.rb

def edit
  @task = Task.find(params[:id])
  respond_to do |format|
    format.html
    format.js
  end   
end

edit.js.erb

$(document).ready( function() {
  $("#edit_task_modal").html("<%= escape_javascript(render 'tasks/edit_task_modal') %>");
  $("#edit_task_modal").modal('show');
});

_edit_task_modal.html.erb

<div class="modal-dialog">
  <div class="modal-content">
    <div class="modal-header">
      <button id="close_edit_task_modal" type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
      <h4 class="modal-title" id="edit_task_modal_label">Edit Task</h4>
    </div>
    <%= form_for(:task, url: {action: 'update', id: @task.id},:html => {:class => 'form-horizontal'}) do |f| %>
      <div class="modal-body">
          <%= render(partial: 'form', locals: {f: f}) %>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <%= f.submit 'Save Changes', class: 'btn btn-primary' %>
      </div>
    <% end %>
  </div>
</div>

_task_div.html.erb

<div class="task well">
  <a>Title: <%= "#{task.title}" %></a><br/>
  Description: <%= "#{task.description}" %> <br>
  Status: <%= "#{task.status}" %> <br>
  Due Date: <%= "#{task.due_date}" %> <br>
  Completed Date: <%= "#{task.completed_date}" %> <br>
  <div style='text-align:right;'>
    <%= link_to 'Edit', {controller: 'tasks', action: 'edit', id: task.id},  {:remote => true, 'data-toggle' =>  "modal", 'data-target' => '#edit_task_modal'}  %>    
  </div>
</div>

show.html.erb

<div id="edit_task_modal" class="modal fade" role="dialog" aria-labelledby="edit_task_modal_label" aria-hidden="true" tabindex="-1"></div>

编辑：添加了模态代码

Answer 1

原来我要做的就是从模态链接中删除'data-toggle'='modal'。 javascript正在显示它，然后html会切换它再次隐藏它。

Rails + Bootstrap Modal呈现但不显示

1 个答案: