Css 使用内联样式的MVC客户端验证？

得到了一个简单的表单，我正在使用数据注释和模型进行自动客户端验证。然而，它看起来相当垃圾，虽然我可以对元素应用一些CSS，但我发现很难让它们显示为工具提示样式的错误

理想情况下，我追求的是：

然而，似乎所有这些类型的实现都需要在验证期间添加新的DOM元素，然后再显示出来，但是默认情况下，我们只有一个包含验证消息的元素

我主要想知道是否有任何预先制作的Jquery插件或与MVC兼容的项目可以让我轻松地进行这种风格的验证，因为我是一名程序员而不是设计师

---

如果没有简单的方法可以做到这一点，那么不用担心，谢谢你的建议

我的验证类似于使用MVC验证和css的演示URL——这并不难做到——我的css如下所示：

.field-validation-error
{
    background:url('/Styles/icons/validation-box-medium.gif') no-repeat;
    padding:10px 4px 4px 28px;
    width:188px;
    height:20px;
    position:absolute;
    z-index:1;
    clear:both;
    color:#780701;
}

我的视图代码如下所示：

            <div>
                <div class="editor-label">
                    <%: Html.LabelRequiredFor(model => model.Product.Price)%>
                </div>
                <div class="editor-field">
                    <%: Html.TextBoxTwoDecimalFor(model => model.Product.Price)%>
                    <div style="clear:both;"></div>
                    <%= Html.ValidationMessageFor(model => model.Product.Price)%>
                </div>
            </div>

型号.产品.价格）%>
型号.产品.价格）%>
型号.产品.价格）%>

我有一个CSS类用于“clear:tware”，也就是说，我从来没有使用过内联样式——但是为了这个例子，我省略了这个

---

欢迎您使用本文的部分或全部内容，包括图片：-）

干杯，伙计，我回家后会看一看，我想您应该确保所有验证消息都符合本示例中提供的长度。。。我在考虑用一个两端分开的盒子，然后用一个可扩展的中心来存放长的验证信息。。。就像旧的html表格设计技巧一样。。。无论如何，再次感谢！你是对的-我以为有限的长度会让我悲伤，但这没关系，因为它是内联的。e、 g.不要说“产品代码不能为空”。你可以说“必填字段”。因为错误指向输入字段-这使得更通用/可重复使用的消息可以整齐地放入复杂的表单中。