削除機能をrjsで実装してみる。

ruby rails

次は、Ajaxっぽく、行削除を実装します。
RailsのRJS機能を利用します。


9.link_to_remoteでリクエスト！！
Ajaxへリクエストを投げる為にAタグを利用してイベントを作りますが、
普通にa href="URL"だと画面が切り替わります。
a href="#" onclick="new Ajax.Request ... と、Ajax系のリクエストを
生成するイベントを記載する必要がありますが、やはりRailsの link_to_remote を
使うと楽にかけます。

link_to_remote("リンク名", :url => { URLとオプション })

こんなんでOKです。

今まで作ってたapp/views/test/list.rhtmlのリスト表示部分に、削除へのリンクを
作ってみます。

<html>
  <head>
    <title>
      名簿管理アプリケーション
    </title>
    <%= javascript_include_tag :defaults %>
  </head>
  <body>
    <hr>

    <ul id="members">
      <% for @member in @members %>
      <li id="member_<%=@member.id %>" >
         名前 : <%= in_place_editor_field :member, 'name'     , {}, { :save_text=>"保存", :cancel_text=>"取消" } %> /
         どんな人 : <%= in_place_editor_field :member, 'atitude'     , {}, { :save_text=>"保存", :cancel_text=>"取消" } %> /
        <%= link_to_remote("削除", :url => { :action => :del,:id => @member.id }) %>
      </li>
      <% end %>
    </ul id="members">

    <hr>
    <%= form_tag :action => 'add' , :id => @member %>
      <p>名前 <%= text_field 'member','name' %>どんな人 <%= text_field 'member','atitude' %><%= submit_tag '登録' %></p>
    <%= end_form_tag %>
  </body>
</html>


10.削除するメソッドを作成
アップデートと同様、削除の受け皿も必要になります。
と言うわけでdelメソッドを作成します。
今回は、送られてきたパラメータのDBを削除するだけなので、そのまま書く事に。*1

class TestController < ApplicationController
  in_place_edit_for :member, :name
  in_place_edit_for :member, :atitude

  def list
    @members = Member.find(:all , :order => "position")
  end

  def add
    @member = Member.new(params[:member])
    @member.save! unless @member.name.blank?

    redirect_to :action=>'list'
  end

  def del
    Member.find(params[:id]).destroy
  end

end

11.RJSを実装する。
RJSで、選択された行を削除するメソッドを実装します。
app/views/test/del.rjs と言うファイルを作成します。
と言っても1行です。
member_idの行を削除しろーって命令です。

page.remove "member_" + params[:id]

これで、削除ボタンを押すと画面上からもDB上からもその行を削除出来る様になりました。

*1:例外処理は無視してます。めんどうなので・・・・・【何】