ASP.NET MVC 必填字段指示符

Question

对于我的 ASP.NET MVC 视图中已按要求归属的字段，框架是否有任何方法可以自动呈现某种指示符，表明该字段在元数据中被标记为必需？

Answer 1

应该能够使用 CSS 来做到这一点，因为 MVC3 将这些自定义属性添加到元素中：

 <input data-val="true" data-val-required="The Username field is required." id="Username" name="Username" type="text" value="" />

您可以在 CSS 中关闭 data-val-required，如下所示：

input[data-val-required] {
背景：红色
}
或设置星号等的背景图像。

Answer 2

我这样做是因为我的必填字段必须是动态的（在配置文件中定义）

在视图末尾添加：

    <script type="text/javascript">
        $('input[type=text]').each(function () {
            var req = $(this).attr('data-val-required');
            if (undefined != req) {
                var label = $('label[for="' + $(this).attr('id') + '"]');
                var text = label.text();
                if (text.length > 0) {
                    label.append('<span style="color:red"> *</span>');
                }
            }
        });
    </script>

Answer 3

我修改了 Renato Saito 的答案以包含更多字段类型（所有类型的输入和选择列表）并使用 jQuery 命名空间而不是通用的 $。这是我的修改：

<script type="text/javascript">
// add indicator to required fields
jQuery('input,select').each(function () {
    var req = jQuery(this).attr('data-val-required');
    if (undefined != req) {
        var label = jQuery('label[for="' + jQuery(this).attr('id') + '"]');
        var text = label.text();
        if (text.length > 0) {
            label.append('<span style="color:red"> *</span>');
        }
    }
});
</script>

Answer 4

这是一个将在具有“data-val-required”属性的任何内容的右侧附加一个红色星号的示例。

<script type="text/javascript">
    $('[data-val-required]').after('<span style="color:red; font-size: 20px; vertical-align: middle;"> *</span>');
</script>

Answer 5

添加 html 属性是不够的。这只会导致 javascript 验证错误。如果您想指示该字段是必填字段，您可能需要为其添加一个星号。您可以通过 HtmlHelper 的扩展方法来完成。您可以在这里找到完整的解释

指示 MVC 应用程序中的必填字段

Answer 6

我这边做了一个小修改。
实际上我有主键（数据库中的身份列）。我不想强调这一点。
因此，我使用下面的代码片段仅选择注释中具有必需属性的 input[type=text] 字段。

$("[data-val-required]").not(":hidden").not(":radio").not(":checkbox").after('<span style="color:red;max-width:10px;min-height:30px;">*</span>');