首页 > 解决方案 > Rails 通过 ajax 提交表单

问题描述

在 Rails 中使用 ajax 存在一些问题。我想在我的 wellcome/inex 页面中创建新帖子。但是当我按下按钮时它显示

没有路线匹配 [POST] "/welcome/index"

惠康/index.html

    <b>Projects</b>

    <ul id="projects">
    <% @projects.each do |project| %>
      <h2><%= project.title %></h2>
    <% end %>
    </ul>

    <br>

    <%= form_for :project do |f| %>
    <%= f.text_field :title, :placeholder => ' Enter new project here..' %>
    <but><%= f.submit 'Add Project'%></but>
    <% end %>

欢迎控制器.rb

class WelcomeController < ApplicationController
  def index
      @projects = Project.all
      @project = Project.new
  end

def create
  @project = Project.new(project_params)

  respond_to do |format|
    if @project.save
      format.html { redirect_to @project, notice: 'project was successfully created.' }
      format.js  
      format.json { render json: @project, status: :created, location: @project }
    else
      format.html { render action: "new" }
      format.json { render json: @project.errors, status: :unprocessable_entity }
    end
  end
end

    private
  def project_params
    params.require(:project).permit(:title)
  end


end

创建.js.erb

$('#projects').html("<%= escape_javascript (render 'projects') %>");

路线项目

Prefix Verb   URI Pattern                 Controller#Action
project_index GET    /project(.:format)          project#index
              POST   /project(.:format)          project#create
  new_project GET    /project/new(.:format)      project#new
 edit_project GET    /project/:id/edit(.:format) project#edit
      project GET    /project/:id(.:format)      project#show
              PATCH  /project/:id(.:format)      project#update
              PUT    /project/:id(.:format)      project#update
              DELETE /project/:id(.:format)      project#destroy

花了很多时间用 AJAX 更新它,但每次都失败了。有什么可以帮忙的吗?提前致谢

标签: javascriptruby-on-railsajax

解决方案


您必须添加remote: true到表单中。

<%= form_for @project, url: project_index_path, remote: true do |f| %>
    <%= f.text_field :title, :placeholder => ' Enter new project here..' %>
    <but><%= f.submit 'Add Project'%></but>
<% end %>

推荐阅读