使用AJAX追加记录

Question

在index.html.erb中，我有一个AJAX表单:

<%= form_for @todo, :remote => true do |f| %>
  <%= f.label :name %> <%= f.text_field :name%>
  <%= f.hidden_field :done, :value => false %>
  <%= f.hidden_field :user, :value => current_user.email %>
  <%= f.submit "Add to todo list" %>
<% end %>

当我使用它提交的东西，我看到他们出现在我的索引页，因为它应该是。然而，我现在正试图使最新添加的元素立即出现。

所以我让create.js.erb

<% if @todo.valid? %>
    $(".todos").append('<li><%= @todo.name %></li>');
    console.log("in here");
<% else %> 
    // Flash message below!
    alert('Something went wrong!');
<% end %>

但是由于某种原因，我无法看到正在添加的记录?我从未看到上面的console.log或alert消息，这意味着它从未执行该代码片段。这是怎么呢

同样，这可能是相关的，在表单提交时，我看到:GET http://localhost:3000/todos 500 (Internal Server Error)

以下是相关的路由

                root GET    /                              home#index
               todos GET    /todos(.:format)               todos#index
                     POST   /todos(.:format)               todos#create
            new_todo GET    /todos/new(.:format)           todos#new
           edit_todo GET    /todos/:id/edit(.:format)      todos#edit
                todo GET    /todos/:id(.:format)           todos#show

在控制器中:

class TodosController < ApplicationController
    def index
        @todo = Todo.new
        @todos = Todo.where(done:false)
    end
def todo_params
    params.require(:todo).permit(:name, :done, :user)
end
def create
    @todo = Todo.new(todo_params)
    if @todo.save
        redirect_to todos_path, :notice => "Your todo item was created!"
    else
        render "new"
    end
end
end

Answer 1

尝试将您的create方法更改为以下内容:

def create
    @todo = Todo.new(todo_params)
    respond_to do |format|
        if @todo.save
            format.js
        else
            render "new"
        end
    end
end

长话短说:你的控制器没有被告知渲染javascript，所以它返回'todos_path' -它没有定义路由。如果你让它渲染js，默认情况下它会寻找methodname.js.erb。通过上面的更改，它应该正确地返回javascript。

Answer 2

可能的实例变量名称错误?

在create.js.erb文件中尝试用<li><%= @todo.name %></li>代替<li><%= @track.name %></li>。

另一个细节:在允许的参数(todo_params)我认为你需要使用:user_id而不是:user。

此外，如果您想处理js.erb模板，则不必在保存实例后使用redirect_to，因此控制器应该为远程提交发送js响应，类似于(与html响应结合):

def create
  @todo = Todo.new(todo_params)
  respond_to do |format|
    if @todo.save
      format.html { redirect_to todos_path, notice: 'Your todo item was created!' }
      format.js
    else
      format.html { redirect_to todos_path, notice: 'Something was wrong!' }
      format.js
    end
  end
end