rails async javascript

_form.html.erb

# rendered in new.js.erb
<%= simple_form_for @task, remote: true do |f|   %>
  <%= f.input  :description                      %>
  <%= f.input  :deadline                         %>
  <%= f.button :submit                           %>
<% end %>

_task.html.erb

 <%= link_to edit_task_path(task), remote: true do %>
   <button>Edit</button>
 <% end %>

create.js.erb

# update task list; hide form

$('#tasks').html("<%= j (render @tasks) %>");
$('#task-form').slideUp(350);

index.html.erb

# (see rai-jax)

# `remote: true` disables Rails default of navigating to `/tasks/new`
<%= link_to new_task_path, remote: true do %>
  <button>New</button>
<% end %>

<div id="task-form" style="display:none;"></div>

<div id="tasks"><%= render @tasks %></div>

new.js.erb

$('#task-form').html("<%= j (render 'form') %>");
$('#task-form').slideDown(350);

tasks_controller.rb

class TasksController < ApplicationController
  before_action :all_tasks, only: [:index, :create, :update]
  before_action :set_tasks, only: [:edit, :update]
  respond_to :html, :js

  # index action rendered automatically

  def new
    @task = Task.new
  end

  def create
    @task  = Task.create(task_params)
  end
  
  def update
    @task.update_attributes(task_params)
  end

  private
    def all_tasks
      @tasks = Task.all
    end

    def task_params
      params.require(:task).permit(:description, :deadline)
    end
edn