【五 form提交及校验】 4. 属性构造器

最新推荐文章于 2023-09-01 15:35:52 发布

weixin_33810302

最新推荐文章于 2023-09-01 15:35:52 发布

阅读量74

点赞数

CC 4.0 BY-SA版权

原文链接：https://my.oschina.net/landas/blog/2995275

本文详细介绍了在Play框架中如何自定义属性构造器，包括默认构造器的使用及如何定义自己的构造器，通过示例展示了如何在模板中使用自定义的构造器。

为什么80%的码农都做不了架构师？>>>

渲染一个属性的时候，不光需要<input>标签，还需要<label>标签。甚至CSS框架可能会要求更多其它标签。

所有的 input helpers 都有一个隐含的 FieldConstructor 以处理这块内容。默认的构造器（在当前域中找不到其他构造器时会生效）生成的HTML如下所示：

<dl class="error" id="username_field">
    <dt><label for="username">Username:</label></dt>
    <dd><input type="text" name="username" id="username" value=""></dd>
    <dd class="error">This field is required!</dd>
    <dd class="error">Another error</dd>
    <dd class="info">Required</dd>
    <dd class="info">Another constraint</dd>
</dl>

默认的构造器也支持额外的入参：

'_label -> "Custom label"
'_id -> "idForTheTopDlElement"
'_help -> "Custom help"
'_showConstraints -> false
'_error -> "Force an error"
'_showErrors -> false

定义自己的属性构造器

如果需要自定义属性构造器，可以从类似下面的模板开始：

@(elements: helper.FieldElements)

<div class="@if(elements.hasErrors) {error}">
    <label for="@elements.id">@elements.label</label>
    <div class="input">
        @elements.input
        <span class="errors">@elements.errors.mkString(", ")</span>
        <span class="help">@elements.infos.mkString(", ")</span>
    </div>
</div>

注意：上面仅仅是一个示例，如果需要它也可以变得很复杂。你也可以使用 @elements.field 来获取原始的属性。

然后使用模板函数来构造一个 FieldConstructor：

object MyHelpers {
  import views.html.helper.FieldConstructor
  import val myFields = FieldConstructor(html.myFieldConstructorTemplate.f)
}

在使用时直接在模板中引入它们就好了：

@import MyHelpers._

@helper.inputText(myForm("username"))

之后Play就会使用你定义好的构造器来渲染此input。

当然你可以在 FieldConstructor 中内联设置一个隐式值：

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

@helper.inputText(myForm("username"))

转载于:https://my.oschina.net/landas/blog/2995275