3

我正在按照官方Java Form Helpers文档编写自己的字段构造函数。我还借鉴了computer-databasePlay 中包含的示例应用程序。

示例应用程序中包含的输入控件模板computer-database如下所示：

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

从这个例子中，很明显如何在元素周围添加额外的<input>元素。我的问题是我想改变<input ...>元素本身的一部分。

我看不到如何执行此操作，因为@elements.input呈现了完整的<input type="..." value="..." ...>HTML 元素，因此我没有机会向input元素添加其他属性。

我想要做的是添加placeholder="my placeholder text". 我想从中获取占位符文本elements.args。

我已经能够通过对 进行字符串操作来实现我想要的@elements.input.buffer，如下所示：

@(elements: helper.FieldElements)
@{
  val buffer = elements.input.buffer;

  val index = buffer.lastIndexOf(">");     // find the closing '>'
  buffer.delete(index, buffer.length - 1); // delete it

  buffer ++= " placeholder=\""             // insert the placeholder attribute
  buffer ++= elements.args('placeholder).toString 
  buffer ++= "\">"                         // close the input tag

  Html(buffer.toString)                    // render as HTML
}

我的问题是：有没有更简单的方法？Play 中是否已经内置了用于此功能的功能？或者这是我调整input领域本身的唯一途径？

4

2 回答 2

4

它已经内置并且可以与您的自定义字段构造函数一起使用。它实际上记录在您链接到的页面上的Rendering an <input> 元素下。

注意：所有额外参数都将添加到生成的 HTML 中，名称以 _ 字符开头的参数除外。以下划线开头的参数保留给字段构造函数参数（我们将在后面看到）。

所以做这样的事情：

@inputText(
  myForm("user"),
  '_label -> "User",
  'size -> 30,
  'placeholder -> "User Name"
)

将像这样输出 HTML：

<input id="user" name="user" size="30" placeholder="User Name">

它记录在某处，但如果你想做data属性，那么你必须这样做：

@inputText(
   ...
   Symbol("data-some-attribute") -> "value"
)
于 2013-08-14T03:06:28.060 回答
0

I had a similar Situation where I needed to Add a class attribute to the field constructor to apply to all fields

     @inputText(engineForm("accessLevel"), '_label -> "access Level", 'class->"form-control")
@inputText(engineForm("logoURL"), '_label -> "Channel Logo", 'class->"form-control")

As you can see I had to add class Attribute to every field definition what I did In field constructor:

  @(elements: helper.FieldElements)

                    <div class="form-group">
                            <label for="@elements.id" class="control-label col-lg-4">@elements.label</label>
                            <div class="col-lg-3">
                            @Html(elements.input.body.dropRight(2)+"class='form-control'>")

                    </div>
                  </div>

this will make you avoid adding the class attribute to every field

于 2013-12-11T15:50:33.610 回答