5. 編集機能

編集機能の開発を行います。http://{IPアドレス}:3000/rosters/{ID}.jsonのURLに変更したいデータをPUT送信すると更新処理を行ってくれるものとします。

 a. コントローラの修正(editメソッド)

それでは、編集作業を行いたいと思います。

Roster/app/RosterServer/roster_server_controller.rbファイルを開いてください。

編集画面を表示する、editメソッドの変更を行います。37行目から以下のように変更してください。

 

37 |  # GET /RosterServer/{1}/edit

38 |  def edit

39 |#    @rosterserver = RosterServer.find(@params['id'])

40 |    id = strip_braces(@params["id"])

41 |    http = Rho::AsyncHttp.get(:url =>

       "#{SERVER_ADDRESS}/rosters/#{id}.json")

42 |    @rosterserver = RosterServer.new(http["body"]) if http["body"]

43 |    if @rosterserver

44 |      render :action => :edit, :back => url_for(:action => :index)

45 |    else

46 |      redirect :action => :index

47 |    end

48 |  end

 

image024.jpg


上記の変更内容を説明いたします。今回の修正は4詳細表示機能と同様の編集になります。

39行目のローカルのデータベースからデータを取得する処理をコメントアウトしています。

40行目で、@params[“id”]の中身が「”{1}”」のようになっているので、「”1”」のように変換して、変数idに代入しています。

そして、41行目で、Rho::AsyncHttp.getメソッドを使用して、GETアクセスをしています。

42行目で、データが取得できていれば、取得したデータを使用してRosterServerオブジェクトを作成して、インスタンス変数@rosterserverに代入しています。

 b. コントローラの修正(updateメソッド)

次に更新処理を行うupdateメソッドの変更を行います。以下のように変更してください。

 

72 |  # POST /RosterServer/{1}/update

73 |  def update

74 |#    @rosterserver = RosterServer.find(@params['id'])

75 |#    @rosterserver.update_attributes(@params['rosterserver']) if @rosterserver

76 |    id = strip_braces(@params["id"])

77 |    json = ::JSON.generate(:roster => @params["rosterserver"])

78 |    Rho::AsyncHttp.post(

79 |      :url => "#{SERVER_ADDRESS}/rosters/#{id}.json",

80 |      :http_command => "PUT",

81 |      :body => "json=#{json}",

82 |      :callback => url_for(:action => :update_callback)

83 |    )

84 |    redirect :action => :index

85 |  end

 

 image026.jpg


上記の処理の説明をします。

74、75行目で自動生成された、ローカルのデータベースに対する処理をコメントアウトしています。

76行目で、@params[“id”]の中身が「”{1}”」のようになっているので、「”1”」のように変換して、変数idに代入しています。

77行目で、編集画面から送られてきたパラメータ@params[“rosterserver”]を::JSON.generateメソッドを使用してJSON形式に変換して、変数jsonに代入しています。

78行目で、Rho::AsyncHttp.postメソッドを使用してサーバにデータをPUT送信しています。接続後のコールバック先にupdate_callbackメソッドを指定しています。

 c.    コントローラの修正(update_callbackメソッド)

次に、更新処理を行った後のコールバック先の処理を実装します。87行目から以下を追加してください。

 

87 |  def update_callback

88 |    if @params["status"] == "ok" && @params["body"] == "OK"

89 |      msg = "更新しました。"

90 |    else

91 |      msg = "更新に失敗しました。"

92 |    end

93 |    Alert.show_popup(msg)

94 |    WebView.navigate(url_for(:action => :index))

95 |  end

 

  image028.jpg


上記の処理の説明をします。

87行目からのupdate_callbackメソッドでは、処理の結果に合わせてポップアップを表示して、一覧表示画面へ遷移させています。

 d.    ビューの修正

次に、編集画面の変更を行います。

Roster/app/RosterServer/edit.erbファイルを開いてください。5行目から以下のように変更してください。

 

05 |    <!--<a href="<%= url_for :action => :show, :id => @rosterserver.object

       %>"  class="ui-btn-left" data-icon="back" data-direction="reverse">-->

06 |    <a href="<%= url_for :action => :show, :id => @rosterserver.id %>"

       class="ui-btn-left" data-icon="back" data-direction="reverse">

07 |      Cancel

08 |    </a>

09 |    <!--<a href="<%= url_for :action => :delete, :id => @rosterserver.object

       %>" class="ui-btn-right" data-icon="delete" data-direction="reverse">-->

10 |    <a href="<%= url_for :action => :delete, :id => @rosterserver.id %>"

       class="ui-btn-right" data-icon="delete" data-direction="reverse">

11 |      Delete

12 |    </a>

13 |  </div>

14 |

15 |  <div data-role="content">

16 |    <form method="POST" action="<%= url_for :action => :update %>">

17 |      <!--<input type="hidden" name="id" value="<%= @rosterserver.object

        %>"/>-->

18 |      <input type="hidden" name="id" value="<%= @rosterserver.id %>"/>

 

 

 image030.jpg


上記の変更内容はいずれも、@rosterserver.objectとなっている箇所を、@rosterserver.idに変更しています。この変更を行うことで、IDパラメータとして渡す値をすべて、サーバから取得したIDに変更しています。


 

システム工房エムのサイトへのリンク

住所〒690-0017 島根県松江市西津田3-2-3 TEL.0852-23-8590 FAX.0852-23-8591
Copyright 2008-2010 System Maker M,All right reserved