在元素上设置验证样式

Posted 2023-05-09

【中文标题】在元素上设置验证样式

【英文标题】：Set Validation Styling on Element

【发布时间】：2018-06-13 05:59:37

【问题描述】：

在我的表单上，我有一个隐藏元素，它被强类型化到视图模型，然后我有一个“虚拟”文本框，用户将在其中输入将被复制到隐藏元素值的值。

剃须刀

@html.HiddenFor(model => model.TestProperty)
@Html.Editor("TestPropertyEmpty", new  htmlAttributes = new  @class = "form-control", @placeholder = "xxxx.x"  )

jQuery

@section scripts
    @Scripts.Render("~/bundles/jqueryval")

    <script>

        //enable jQuery validation on hidden elements
        $.validator.setDefaults(
            ignore: []
        );


        $(document).ready(function() 

            $("#TestProperty").val(''); // clear value for validation purposes

            /* Created a 'dummy' textbox so that it will be empty on page load instead of using jQuery to clear the actual strongly-typed property
                because you can see the textbox being cleared on page load.  So once user enters value into dummy textbox then that value will be 
                the value for the actual model property that is hidden
            */
            $("#TestPropertyEmpty").blur(function() 
                $("#TestProperty").val(this.value);
                console.log($("#TestProperty").val());
            );

        );
    </script>

目标

TestProperty 属性是必需的，它是隐藏的，但我仍然需要对其进行验证，因此$(document).ready... 上方的代码的 sn-p 可以对隐藏元素进行验证。

但我的目标是当TestProperty 为空并且用户尝试提交时..

由于隐藏了实际属性，我希望“虚拟”文本框以红色突出显示？我该如何做到这一点？

另外，这些元素是否真的与模型无关，但用于我的示例中的这些目的？

我不喜欢“虚拟元素”这个词。

然后我可以编辑我的问题标题以代表更好、信息量更大的风格。

【问题讨论】：

这是一个概念性的东西吗？为什么需要虚拟字段？文本框和隐藏字段都可以存储相同的信息。

@ADyson 这更像是一种强迫症。. 虚拟字段的目的是让我不必使用$("#...).hide().. 因为如果我这样做.. 我可以看到0.00 在页面加载时被隐藏.. 没什么大不了的.. 但我想知道我所问的是否可能。

为什么需要隐藏它？似乎有点复杂的方法只是显示空而不是 0.00。是绝对必要的吗？如果该字段是必需的，则 0 是一个完全有效的值。为什么用户看不到？如果您希望他们设置不同的值，则通过设置字段值必须大于 0 的规则来验证

@ADyson 抱歉，不是隐藏.. 但$("#...).val('').. 并不意味着隐藏.. 0.00 是允许的，我不希望在页面加载时加载该值，因为一些用户会忽略它，因为它具有价值。

好的，但我的观点与我上一条评论完全相同，只需将“隐藏”一词替换为“空白”即可。

【参考方案1】：

您可以在原始字段上使用Range 验证规则来指定提交表单时，字段的值必须大于 0。如果用户忽略该字段，他们将收到验证错误。它肯定比你现在尝试做的更简单、更干净。

这与您当前的设计等效，因为如果您不希望该字段为空白，那么您实际上是在说（因为 0 存储在隐藏字段中）您不希望它为 0，并且验证将具有相同的效果，因为它确保用户关注该领域。事实上，在您之前的方法中，用户可以再次在框中输入 0，这似乎是您不乐意让他们输入的值。

【讨论】：

谢谢！快速问题.. 使用 EF Code-First 时.. 是否有数据注释只允许小数点属性的小数点后一位？在 SQL 中，对于TestProperty.. 它是十进制(18,2).. 但我想要 (18,1).. 是否有为此的数据注释然后迁移和更新？

这有帮助吗？ ***.com/questions/19811180/… 。您可以稍微更改表达式以仅检查小数点后 1 位的精度。我不确定您如何将其与您的 EF 实体相关联，您所说的“迁移和更新”到底是什么意思？您是使用 DTO/ViewModel，还是直接使用 EF 实体作为模型？

ViewModels 用于我的视图.. 所以我想我不需要使用迁移.. 也许正则表达式会起作用。

很好奇，有没有关于代理字段的文章/文档？解释该术语的来源等？

@GTown-Coder 我相信你知道，一般使用的“代理”是可以替代其他东西的东西。我并没有真正在特定的技术意义上使用它。

【参考方案2】：

您可以将所需的属性添加到输入中

<input id="TestPropertyEmpty" required />

然后瞧。如果这没有帮助，请告诉我。

【讨论】：

这种方法会产生额外的错误消息。我已经在验证该模型属性，TestProperty.. 所以如果它是空白的，那么我会收到错误消息。如果我尝试您的方法，我会收到一条额外的验证消息，This field is required。

是的，我知道，这只是另一种需要解决方法的解决方法。我会回来提供更好的解决方案

【参考方案3】：

TestProperty 属性是必需的，它是隐藏的，但我仍然 需要验证

我已经写了一个关于以下主题的答案，HERE。看完了，希望对你有帮助。

在某些情况下，您希望 忽略一个或多个验证 客户端中的隐藏字段（并非所有隐藏字段）以及您 想要在服务器端中验证它们和其他隐藏字段。