如何在Play Framework中创建多个自定义字段？

Question

我正在尝试构建多个自定义字段.

使用这篇文章作为参考.

创建后MyHelpers.

object MyHelpers {

  //This '.f' is kinda mysterious/magic...
  implicit val myFields = FieldConstructor(myFieldConstructorTemplate.f)    

}

我导入我的 .scala.html

@import MyHelpers._

然后当我做的时候神奇地

@inputText(myForm("username"))

它将使用我的构造函数 MyHelpers

但是,我将如何创建多个构造函数,因此我可以创建不同的输入类型,如:

@inputText(myForm("username"))
@inputDate(myForm("birth"))

我该如何实现？

首先,我是Scala的新手(已经阅读过书籍和文章以及关于Scala的事情很长一段时间但很难编写一些内容).我很抱歉这样的问题,但scala使得学习Play很难,看起来你需要掌握Scala,所以你可以吸收Play,甚至可以理解它是如何构建的.在这些情况下,文档没有太大帮助.

Answer 1

另一种方法是在scala对象(不同的文件)中创建多个字段,然后在视图中导入此对象.其余的很容易遵循.

第一步:为您要构建的字段创建视图.我们称之为textinputgroup.scala.html

它将包含此代码

@(elements: helper.FieldElements, text: String)
<div class="form-group input-group if(@elements.hasErrors) {error}">
   <span class="input-group-addon">@text</span>
   @elements.input
   <span class="errors">@elements.errors.mkString(", ")</span>
</div>

然后:创建对象助手.我们称之为bootstrap.scala并在其中放入您要创建的字段.(您可以将bootstrap.scala和textinput.scala.html放在'views'目录下的同一文件夹中)

package views
import views.html.helper._

object bootstrap {
  implicit val addressinputgroup = new FieldConstructor {
    def apply(elements: FieldElements) = textinputgroup(elements, "@")
  }
  implicit val passwordinputgroup = new FieldConstructor {
    def apply(elements: FieldElements) = textinputgroup(elements, "*")
  }
}

最后:在视图中导入并使用此对象.

@(signin: Form[forms.Signin]) /* Insert here your real form definition */
@import helper._
@import views.bootstrap._

/* Inside the body */
@helper.form(action = routes.Auth.submit()) {
  @inputText(signin("email"), 'class -> "form-control", 'placeholder -> "Email")(addressinputgroup, implicitly[Lang])
  @inputPassword(signin("password"), 'class -> "form-control", 'placeholder -> "Password")(passwordinputgroup, implicitly[Lang])
  <button class="btn btn-default" type="submit">Sign Up &raquo;</button>
}

我在此存储库中创建了一些示例,以使用Bootstrap(multipleFieldConstructor)和Semantic-UI(semanticuiformhelper)框架创建多个字段.去看一下.

Answer 2

答案取决于"不同输入类型"的含义.如果你想让你的username字段像普通的文本框一样,而你birth就像日期选择器,那么你真的不需要搞乱字段构造函数,你可能只需要一个自定义的"输入帮助器".

输入助手是定义HTML输入元素本身的scala模板.在日期选择器的情况下,您将拥有输入文本字段,并且它还可能包含用于弹出日历或其他内容的小日历图形.

字段构造函数是围绕帮助程序生成的HTML输入元素的所有HTML.这包括任何div使其适合页面结构的s,并生成与该字段相关的帮助/错误文本.

输入助手

我的猜测是你真正想要自定义的是输入助手.如果@inputDate没有做你需要的,那么你可以创建自己的.在GitHub上查看Play的内置输入助手,例如:

https://github.com/playframework/Play20/tree/2.0.x/framework/src/play/src/main/scala/views/helper

现场施工人员

如果您想要多个字段构造函数,那么这也是可能的.您实际上可以根据需要定义任意数量,并在每个字段的基础上选择它们.在您链接的同一文档页面上,它显示了一种直接在视图上定义字段构造函数的替代方法.

@implicitField = @{ FieldConstructor(myFieldConstructorTemplate.f) }

这将是你的默认字段构造函数(因为它以@implicit开头？我不完全理解这一部分).要定义第二个,只需复制该行,但调用变量不同.这是我在项目中使用的东西:

@selectFieldConstructor = @{ FieldConstructor(entryFormFieldConstructor.f) }

并使用它:

@select(
  myForm("gender"),
  ...
)(handler = selectFieldConstructor, implicitly[Lang])

希望这可以帮助.