Question

我正在开发一个简单的待办事项列表。我想要为每个列表项删除和编辑按钮。我也想在模态窗口中编辑和创建打开。现在这适用于创建，我无法弄清楚如何使其与编辑一起工作（现在模态窗口显示，但它加工了一个创建窗口）。

这是我的index.html：

<div class="container-fluid">
    <div class="row">
        <h1 class="text-left">Task List</h1>
        <button type="button" class="btn btn-primary pull-right" data-toggle="modal" data-target="#myModal">New task</button>
    </div>
    <div class="row button-margin ">
    <% @tasks.each do |task| %>
            <div class="panel <%= task_status(task) %>">
                <div class="panel-heading">
                    <%= task.title %>
                    <%= link_to task_path(task),  class:"btn btn-link pull-right", method: :delete, data: { confirm: 'Are you sure?' } do %>
                        <span class="glyphicon glyphicon-remove" style="color:gray"></span>
                    <% end %>
                    <!-- <button type="submit" class="btn btn-link pull-right"> -->
                    <%= link_to edit_task_path(task), class:"btn btn-link pull-right", remote:true, "data-toggle" => "modal",  "data-dismiss=" => "modal", "data-target" => "#myModal" do %>
                        <span class="glyphicon glyphicon-pencil" style="color:gray"></span>
                <!--    </button> -->
                    <% end %>
                </div>
                <div class="panel-body">    
                    <h3><%= task.body %></h3>
                </div>
            </div>
        <% end %>
    </div>

    <%= render "tasks/form" %>
</div>

这是_form partial with modal

  <div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">New task</h4>
        </div>      
        <div class="modal-body">
          <%= form_for @task, :html => {class:"form-horizontal"} do |f|%>
            <div class="form-group">
              <label for="inputTitle" class="col-sm-2 control-label">Title</label>
              <div class="col-sm-10">
                  <%= f.text_field :title, class:"form-control", id:"inputTitle", placeholder:"Title" %>
              </div>
            </div>
            <div class="form-group">
              <label for="inputBody" class="col-sm-2 control-label">Task</label>
              <div class="col-sm-10"> 
                <%= f.text_area :body, class:"form-control", id:"inputBody", placeholder:"Task text", rows:"3"%>
              </div>
            </div>
            <div class="form-group">
              <label for="dueDate" class="col-sm-2 control-label">Date</label>
              <div class="col-sm-10">
                <%= f.datetime_local_field :dueDate, class:"form-control", id:"dueDate"%>
              </div>
            </div>
            <div class="modal-footer">
              <%= f.submit class:"btn btn-primary"%>
              <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
          <% end %>
        </div>
      </div>
    </div>
  </div>

还有任务控制者：

class TasksController < ApplicationController
    def index
        @tasks=Task.all
        @task = Task.new
    end

    def new
        @task=Task.new
    end

    def show
        @task=Task.find(params[:id])
    end

    def edit
        @task=Task.find(params[:id])
    end

    def create
        @task=Task.new(task_params)
        if @task.save
            redirect_to tasks_path
        else
            render 'new'
        end
    end

    def update
        @task = Task.find(params[:id])

        if @task.update(task_params)
            redirect_to tasks_path
        else
            render 'edit'
        end
    end

    def destroy
        @task = Task.find(params[:id])
        @task.destroy

        redirect_to tasks_path
    end

    private
        def task_params
            params.require(:task).permit(:title, :body, :creationDate, :dueDate)
        end
end

有人可以解释我做错了什么吗？ Wy表单会打开，但不会填充选定的任务吗？

Answer 1

您在remote: true中使用link_to edit_task_path(task)。这样，任务将异步加载，页面将不会刷新。这就是为什么你的表格没有被填满。

此外，使用相同的链接加载任务并打开模态。我认为你需要一个更好的方法。

Answer 2

在edit.html.erb

中

request.form.get('name')
request.form.get('slogan')

在index.html.erb中为编辑页面添加ajax调用，获取编辑页面并以模态显示。

使用rails和bootstrap以模态编辑

2 个答案: