验证失败时,TextBox周围出现红色边框

thd*_*thd 5 validation asp.net-mvc-2

我正在使用ASP.NET MVC 2.

Html.DropDownListFor和Html.TextAreaFor在验证失败时自动获得红色边框.

如何在验证失败时使TextBox的四个边框(使用Html.TextBoxFor)变为红色?

例如,我有一个需要的TextBox,当用户提交表单时没有在文本框中指定值,我希望文本框有红色边框.

Cha*_*ino 24

当模型属性的验证失败时 - 它会在html的输入中添加一个类.在验证失败时(使用视图源或firebug)查看渲染的html,并查看输入的类*.然后编辑您的css以包含失败验证的样式.

例如,在我的项目中,我有:

input.input-validation-error,
textarea.input-validation-error,
select.input-validation-error
{
    background: #FEF1EC;
    border: 1px solid #CD0A0A;
}
Run Code Online (Sandbox Code Playgroud)

HTHs,
查尔斯

*我非常确定ASP.NET MVC input-validation-error默认添加该类.

  • 你的回答指出了我正确的方向.我发现以下css(在Site.css中):input [type ="text"] {width:200px; border:1px solid #CCC; 覆盖了这个css:.input-validation-error {border:1px solid#ff0000; background-color:#ffeeee; 因此,验证失败时,TextBoxes的边框永远不会变为红色.通过将css更改为以下.input-validation-error {border:1px solid#ff0000!important; background-color:#ffeeee; 验证失败时,边框为红色. (4认同)

小智 7

您需要做的就是下面的 CSS:

.input-validation-error {
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}
Run Code Online (Sandbox Code Playgroud)