2

我想在我的表单模板中使用@inputRadioGroup帮助器（在此处找到）：

@inputRadioGroup(
          contactForm("gender"),·
          options = options("M"->"Male","F"->"Female"))

好吧，一切都好。但我想使用icon/image而不是text. 类似的东西（使用 twitter bootstrap css）：

@inputRadioGroup(
          contactForm("gender"),·
          options = options("M"->"<i class="icon-user"></i>","F"->"<i class="icon-user"></i>"))

好吧，在这种情况下，生成的 html 代码是：

<label for="gender_M">
&amp;lt;i class=&amp;quot;icon-user&amp;quot;&amp;gt;&amp;lt;/i&amp;gt;
</label>

图标 html 被转义。不显示图标。我怎样才能用这个助手来发展我的想法？

注意：我尝试使用Html()方法，但遇到了同样的问题。以下 Scala 行代码：

options("M"->Html("<i class=\"icon-user\"></i>").text)

生成以下 HTML 代码：

<label for="gender_M">&lt;i class=&quot;icon-user&quot;&gt;&lt;/i&gt;</label>

浏览器中的渲染是：

<i class="icon-info-sign"></i>

没有显示图标，因为 html 转义......有人知道吗？

提前致谢。

4

2 回答 2

1

覆盖默认字段帮助器，例如，通过inputRadioButton.scala.html在views.utils包中创建具有以下内容的文件（根据需要进行修改）：

@(field: play.api.data.Field, options: Seq[(String,String)], args: (Symbol,Any)*)(implicit handler: helper.FieldConstructor, lang: play.api.i18n.Lang)

@helper.input(field, args:_*) { (id, name, value, htmlArgs) =>
  <span class="buttonset" id="@id">
    @options.map { v =>
      <input type="radio" id="@(id)_@v._1" name="@name" value="@v._1" @(if(value == Some(v._1)) "checked" else "") @toHtmlArgs(htmlArgs)>
      <label for="@(id)_@v._1">@Html(v._2)</label>
    }
  </span>
}

然后当你想在你的字段模板中显示时：

@import helper._
@import views.utils.inputRadioButton
于 2012-10-05T15:44:29.573 回答
0

如果您需要将类应用于生成的标签标签，那么您就不走运了。创建 radioButtonGroup 的代码本身就是一个 scala 模板——它看起来像这样：

@input(field, args:_*) { (id, name, value, htmlArgs) =>
  <span class="buttonset" id="@id">
    @options.map { v =>
      <input type="radio" id="@(id)_@v._1" name="@name" value="@v._1" @(if(value == Some(v._1)) "checked" else "") @toHtmlArgs(htmlArgs)>
      <label for="@(id)_@v._1">@v._2</label>
    }
  </span>
}

如您所见，标签标签填充了选项标签，这是一个将被转义的字符串。您可以使用具有如下选择器的 CSS 规则设置背景图像：

span.buttonset#fieldId label:

或者，您可以手动创建 HTML，或者根据文档编写自己的帮助程序。

于 2012-10-05T15:04:15.220 回答