Rails submitting a form through ajax

Question

There is some problem with using ajax in rails. I want to create new post in my wellcome/inex page. But when I push the botton it show

No route matches [POST] "/welcome/index"

wellcome/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 %>

welcome_controller.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

create.js.erb

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

routes project

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

Spent a lot of time updating this with AJAX but failed everytime. Any there to help? Thanks in advance

Answer 1

You have to add remote: true into form.

<%= 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 %>

Answer 2

If you want integrate Ajax and Ruby you need to add the line below inside your link action

remote:true

also you can check this about Ajax and Ruby How Ajax works with ruby on rails