CSS to conf / messages in play框架

时间:2015-05-27 01:23:17

标签: java css intellij-idea playframework playframework-2.0

我在play framework的 conf 目录下有消息。

required.message=This field cannot be empty

在模型中,我有:

@Constraints.Required(message = "required.message")
public String name;

我在验证时正确收到消息。我想要做的是,改变消息的颜色。目前我得到如下:

enter image description here

我想要消息" 此字段不能为空"是红色的。

编辑:

查看代码

@(customerForm : Form[Customer])

<link rel="stylesheet" media="screen" href="@routes.Assets.at("css/bootstrap.min.css")">
<script src="@routes.Assets.at("js/bootstrap.min.js")" type="text/javascript"></script>
@main("Customer information") {
    <h2 style="margin-left: 5%">Customer Information</h2>
    @helper.form(action = routes.Customers.save()) {
        <fieldset style="margin-left: 5%">
            <legend>Adding new customer</legend>
            @helper.inputText(customerForm.field("Id"), '_label -> null,'placeholder->"Id")
            @helper.inputText(customerForm.field("name"), '_label -> null, 'placeholder->"Name", '_showConstraints -> false)
            @helper.inputText(customerForm.field("address"), '_label -> null, 'placeholder->"Address", '_showConstraints -> false)
            @helper.inputText(customerForm.field("city"), '_label -> null, 'placeholder->"City", '_showConstraints -> false)
            @helper.inputText(customerForm.field("state"), '_label -> null, 'placeholder->"State", '_showConstraints -> false)
            @helper.inputText(customerForm.field("postcode"), '_label -> null, 'placeholder->"Postcode", '_showConstraints -> false)
            @helper.inputText(customerForm.field("phone"), '_label -> null, 'placeholder->"Phone number", '_showConstraints -> false)
            @helper.inputText(customerForm.field("email"), '_label -> null, 'placeholder->"Email", '_showConstraints -> false)
        </fieldset>
        <input class="btn btn-success" style="margin-left: 5%"  type="submit" value="Save"/>
        <input class="btn btn-danger" style="margin-left: 5%" onClick="window.location='@routes.Customers.list()';" type="button" value="Cancel"/>
    }
}

谢谢!

1 个答案:

答案 0 :(得分:1)

您应该在CSS样式表中添加所需的样式,并创建一个满足您需求的自定义表单助手。

以下是基于docs的自定义 customInputText.scala.html 文件的最简单示例:

@(elements: helper.FieldElements)

<div>
    <label for="@elements.id">@elements.label</label>
    <div>
        @elements.input
        <span class="errors">@elements.errors.mkString(", ")</span>
    </div>
</div>

在你的CSS文件中你可以有这样的东西:

.errors {
  color: red;
}

接下来,您应该使用表单在视图中的所有导入旁边添加新创建的字段构造函数,以便可以自动使用它。表单本身不需要进行任何更改。它将隐式选择构造函数:

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

通过创建自定义字段构造函数,您可以在整个应用程序中重复使用它。