Question

我在ASP.NET MVC3 Razor中使用“jQuery Validate Unobtrusive”。

我有一个带有“评论”表单的页面，如下所示：

模型

public class CommentModel
{

    [Required]
    public string Name { get; set; }

    [Required]
    [DataType(DataType.EmailAddress)]
    public string Email { get; set; }

    [DataType(DataType.Url)]
    [Display(Name = "Website URL")]
    public string WebsiteUrl { get; set; }

    [Required]
    public string Message { get; set; }

}

查看

    @using (Html.BeginForm("AddComment", "Blog", new { @articleID = article.ID }))
    {
        <p>
            @Html.LabelFor(m => m.commentModel.Name)
            @Html.TextBoxFor(m => m.commentModel.Name)
            @Html.ValidationMessageFor(m => m.commentModel.Name)
        </p>
        <p>
            @Html.LabelFor(m => m.commentModel.Email)
            @Html.TextBoxFor(m => m.commentModel.Email)
            @Html.ValidationMessageFor(m => m.commentModel.Email)
        </p>
        <p>
            @Html.LabelFor(m => m.commentModel.WebsiteUrl)
            @Html.TextBoxFor(m => m.commentModel.WebsiteUrl)
            @Html.ValidationMessageFor(m => m.commentModel.WebsiteUrl)
        </p>
        <p>
            @Html.LabelFor(m => m.commentModel.Message)
            @Html.TextAreaFor(m => m.commentModel.Message)
            @Html.ValidationMessageFor(m => m.commentModel.Message)
        </p>
        <p>
            <input type="submit" value="Submit Comment" />
        </p>
    }

但是，在提交表单时，只有Name和Email会返回验证错误，而Message也应该是：

enter image description here

如果我将Message从TextAreaFor更改为TextBoxFor，则验证工作正常。

为什么会这样，以及如何在我的文本框中进行验证？

也许值得注意的是我没有必要为这个表单编写任何特定的jQuery。我按照一个教程解释说这不是必需的，因为它全部由MVC3处理。

Answer 1

使用[DataType(DataType.MultilineText)]数据注释装饰相应的模型属性，并使用Html.EditorFor Helper方法。

[Required]
[DataType(DataType.MultilineText)]
public string Message { get; set; }

现在使用@Html.EditorFor助手方法

@Html.EditorFor(m => m.RoleDescription)

Answer 2

当模型嵌套时，TextAreaFor会出现错误。将CommentModel的内容放在“根”模型中可以说，一切都很好。或者，将TextAreaFor更改为TextBoxFor，它的效果很好！

在一个不相关的主题上，我觉得我不是唯一一个尝试像你一样嵌套我的评论模型的人。这应该是固定的！

修改以下是该问题的错误凭证：

http://aspnet.codeplex.com/workitem/8576

<强> EDIT2： Shyju使用EditorFor工作的解决方法！有趣的是，它还为输出添加了一些额外的类名，所以要小心它们不会与你的CSS冲突。

Answer 3

@Shyju的回答似乎完美无缺，但我必须在Site.css文件中添加一些内容才能使其正常工作：

应用@Shyju解决方案并添加 css for textarea ：

textarea.input-validation-error {
    border: 1px solid #e80c4d;
}

现在它完美无缺。

jQuery Validate Unobtrusive不适用于TextArea

3 个答案: