Play Framework 2.6(Scala)でFormにhiddenを埋め込んでみる

概要

ScalaのPlay FrameworkでFormに、hiddenタグをどう埋め込むかについて調べてみた＆試しにサンプルを作成してみました。

前提

Play Framework2.6を前提としているので、Formの基本的な仕様は以前に私が投稿した、Play Framework 2.6(Scala)でFormの処理を作ってみたの内容をご参照ください。

##対応方法
How to hide a text field in play frameworkのstackoverflowの記事によるといくつか対応方法はあるようですが、今回のサンプルはinputタグを直接使う方法で試してみました。

##サンプルの概要
とあるカテゴリーの登録画面で既存にあるカテゴリーを変更するイメージを前提として、リクエストパラメータで受け取ったIDをFormのhiddenに埋め込むようなサンプルソースにしています。DB接続部分は割愛しています。

##サンプルソース

【routesファイル】

GET     /categoryregist                  controllers.CategoryController.registCategoryDisplay(categoryIdParam: Option[String])
POST     /categoryregist                  controllers.CategoryController.categorySubmit

【models】

models.scala

package models

case class Category(
    categoryid:String,
    categoryname:String, 
    categorysort:String); 

【controllers】

CategoryController.scala

package controllers

import javax.inject._
import play.api._
import play.api.mvc._
import play.api.data._
import play.api.data.Forms._
import models._
import play.api.i18n.I18nSupport
import play.api.i18n._
import commonlogic.logicservice.tablemodel.CategoryTable
import commonlogic.logicservice.CategoryService
import models.Category
import java.time.ZonedDateTime


class CategoryController @Inject()( cc: ControllerComponents ) extends AbstractController(cc) with I18nSupport {

  // カテゴリーフォーム
  val categoryForm = Form( mapping( "categoryid" -> text ,
                                    "categoryname" -> text, 
                                    "categorysort" -> text
                                    )
                                    (Category.apply)(Category.unapply) 
                           )

  // カテゴリー登録画面の表示
  def registCategoryDisplay(categoryIdParam: Option[String]) = Action { implicit request =>
    // IDのリクエストパラメータチェック
    categoryIdParam match {
      case Some(categoryIdString) =>
        // DBからカテゴリーテーブルのデータ取得（サンプルでは内容を割愛）
        var categoryTableFromId = CategoryService.getCategoryById(categoryIdString)
        // DBからオブジェクトが取得できた場合
        if( categoryTableFromId != null){ 
          // formにセット
          val categoryFilledForm = categoryForm.fill(Category(categoryIdString , categoryTableFromId.categoryname , categoryTableFromId.categorysort))
          // formの値を埋めてカテゴリー登録画面へ遷移
          Ok( views.html.categoryRegist(categoryFilledForm) )
        }else{
          // そのままカテゴリー登録画面へ遷移
          Ok( views.html.categoryRegist(categoryForm) )
        }
      case None =>
        // そのままカテゴリー登録画面へ遷移
        Ok( views.html.categoryRegist(categoryForm) )
           
   }
  }
  
  // カテゴリー登録画面からのsubmit
  def categorySubmit() = Action { implicit request: Request[AnyContent] =>
    categoryForm.bindFromRequest.fold(
      // 入力チェックNG
      errors => {
        BadRequest( views.html.categoryRegist(errors) )
      },
      // 入力チェックOK
      success => {
        // フォームのカテゴリー情報
        var category = categoryForm.bindFromRequest.get
        if(category.categoryid != ""){
          // カテゴリーをアップデート（サンプルでは内容を割愛）
          CategoryService.updateCategory(category.categoryid , category.categoryname , category.categorysort)
          Ok( views.html.categoryregistSuccess() )
        }else{
          Ok( views.html.categoryregistError() )
        }
      }
    )
  }

【view】

categoryRegist.scala.html

@(categoryForm)(implicit request: RequestHeader, messagesProvider: MessagesProvider)
@import helper._
@main("サンプル"){
    <font size=5>■カテゴリー登録画面</font><br/><br/>
    @helper.form( action = helper.CSRF(routes.CategoryController.categorySubmit) ){
        <fieldset>
          @helper.inputText(categoryForm("categoryname") , '_label -> "カテゴリー名")
          @helper.inputText(categoryForm("categorysort") , '_label -> "ソート番号")
        </fieldset>
        <input type="hidden" value="@categoryForm("categoryid").value" name="categoryid">
        <input type="submit" value="変更する">
    }
}