索引中的Ajax编辑页面

Question

I have this page Index page:

<h1>Listing users</h1>

<table border="1">
  <tr>
    <th>Name</th>
    <th>Description</th>
    <th>Who</th>
    <th></th>
    <th></th>
    <th></th>
  </tr>

<% @users.each do |user| %>
  <tr>
    <td><%= user.name %></td>
    <td><%= user.description %></td>
    <td><%= user.who %></td>
    <%= render 'users/form' %>
    <td><%= link_to 'Show', user %></td>
    <td><%= link_to 'Edit', edit_user_path(user) %></td>
    <td><%= link_to 'Destroy', user, method: :delete, data: { confirm: 'Are you sure?' } %></td>
  </tr>
<% end %>
</table>

<br />

<%= link_to 'New User', new_user_path %>

Scaffold controller

def index
    @users = User.all

    respond_to do |format|
      format.html # index.html.erb
      format.json { render json: @users }
    end
  end

I need to edit user in index page, not to go url /users/2/edit, stay on users page.

How I do this in Ajax?

Answer 1

Add remote:true to the Edit line in order to make an ajax call:

<td><%= link_to 'Edit', edit_user_path(user), remote:true %></td>

Also, add an edit.js.erb file (a javascript file with embedded ruby) in which you do all the javascript actions to be executed after the Edit. That edit.js.erb file is generated when the edit method is done. This is where you write all the changes to the javascript code which affect the current page (the page will not be re-rendered).

Additionally, add the following to the edit method:

respond_to do |format|
   format.js
end