SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

DeveloperZine(デベロッパージン)- エンジニアの意思決定を支える技術情報メディア ProductZine

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

近未来の技術トレンドを先取り! 「Tech-Sketch」出張所

ScalaのWebアプリケーションフレームワーク「Play Framework」入門
~(3)CRUD操作を行うWebアプリケーションの作成 後編

近未来の技術トレンドを先取り! 「Tech-Sketch」出張所 第14回

簡単アプリの開発(4)

(3)イベント削除機能

 イベント削除機能はイベント検索画面の検索結果一覧から削除したいデータ行の削除アイコンをクリックすることで、EVENTテーブルから該当データを削除するという機能とします。

 まずは、routesにイベント削除用のURLを定義します。

routes(/conf)

GET     /event/:id/delete/       controllers.event.EventSearch.delete(id: Int)

 イベント削除用の画面は設けず、検索画面の一覧から直接削除するので、「EventSearch」オブジェクトに「delete」メソッドを追加します。

[Controller]EventSearch.scala(/app/controllers/event)

/** 削除 */
def delete(id: Int) = Action { implicit request =>
  Events.delete(id)
  Ok(views.html.event.eventSearch(eventForm, null))
}

 「delete」は「Events」オブジェクトの「delete」メソッドで対象データを削除し、再び検索画面を初期状態で表示します。

 「Events」オブジェクトに「delete」メソッドを実装します。「delete」は引数に対象データの「id」を受け取り、受け取った「id」をキーにEVENTテーブルから該当行を削除します。

[Model]Events.scala(/app/models)

/** 削除 */
def delete(id: Int) = database.withTransaction { implicit session: Session =>
  Event.filter(_.id === id).delete
}

 イベント検索画面の検索結果一覧には、先ほど追加した更新アイコンの横に削除アイコンを作成し、データの削除ができるようにします。

[View]eventSearch.scala.html(/app/views/event)

@(eventForm: Form[EventForm], events: List[Tables.EventRow])

@import helper.twitterBootstrap._

@main("イベント検索") {
  @helper.form(action = controllers.event.routes.EventSearch.search()){
    <div class="container">
      <fieldset>
        <legend>イベントの情報</legend>
        @helper.inputText(eventForm("eventId"))
        @helper.inputText(eventForm("eventNm"))
        <button type="submit" class="btn btn-primary">検索</button>
      </fieldset>

      @if(events) {
        <legend>イベント一覧</legend>
        <table class="table table-striped table-bordered table-hover">
          <thead>
            <tr>
              <th>イベントID</th>
              <th>イベント名</th>
              <th></th>
            </tr>
          </thead>
          <tbody>
            @for((event) <- events){
              <tr>
                <td>@event.eventId</td>
                <td>@event.eventNm</td>
                <td>
                  <a href="@controllers.event.routes.EventUpdate.index(event.id)">
                    <i class="glyphicon glyphicon-edit"></i>
                  </a>
                  <a href="@controllers.event.routes.EventSearch.delete(event.id)">
                    <i class="glyphicon glyphicon-remove"></i>
                  </a>
                </td>
              </tr>
            }
          </tbody>
        </table>
      }
    </div>
  }
}

 以上でイベント削除機能が実装できましたので、画面で確認してみましょう。イベント検索画面で検索すると結果一覧に削除アイコンが追加されていますので、クリックしデータを削除します。

 削除したら再度検索を行い確認してみましょう。データが削除されました。

 以上で、イベント情報に対する登録・検索・更新・削除機能が完成しました。

(4)ラベルの日本語化

 画面を見てみると表示されているラベルが「eventId」「eventNm」のように変数名がそのまま出力されています。これを日本語化しておきましょう。変数名を日本語に置き換えるには「conf」ディレクトリに「messages」というファイルを作成し、変数名に対して日本語名を定義します。

messages(/conf)

eventId = イベントID
eventNm = イベント名

 再度画面を確認するとラベルが日本語になりました。

次のページ
簡単アプリの開発(5)

この記事は参考になりましたか?

近未来の技術トレンドを先取り! 「Tech-Sketch」出張所連載記事一覧

もっと読む

この記事の著者

前出 祐吾(TIS株式会社)(マエデ ユウゴ)

TIS株式会社 コーポレート本部 戦略技術センター所属。これまで社内向けWebアプリケーションフレームワークの開発やJenkinsの活用を中心に様々な手段で開発の効率化を図ってきた。現在は、さらに革命的な効率化を目指し、Scalaを活用した次世代開発基盤の研究&開発に従事している。システム開発は、泥...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

CodeZine(コードジン)
https://codezine.jp/article/detail/7817 2014/06/20 14:00

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー