用星号屏蔽 EditorFor 模型的整数值

Question

我在视图中有以下代码：

@Html.EditorFor(model => model.EmployeeId, new { htmlAttributes = new { @class = "form-control", @tabIndex = 4 } })

我的模型有：

        [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:#.#}")]
        [Display(Name = "Badge")]
        [Required]
        public int EmployeeId { get; set; }

我正在尝试让 employeeId 文本框的输入变成星号，就好像它是密码一样。我不能使用 PasswordFor 标签，因为我们不希望它被浏览器保存或提示。

我知道当字段在 jQuery 中失去焦点时我可以更改实际值，但似乎设置字段文本由于某种原因不起作用并且它一直显示数值。

<script type="text/javascript">

    $('#EmployeeId').focusout(function () {
        $(this).text('***');
    })
</script>

有没有办法让它为用户输入的每个数字显示一个星号，同时在模型中保留真实值？

非常感谢！ :)

Answer 1

用星号屏蔽文本的唯一方法是使用 "password" 的输入类型，它可用于您想要像这样混淆的任何类型的信息，而不仅仅是密码。

然而，

EditorFor 是一个 "templated" 帮助程序，也就是说它呈现 HTML 以通过 Razor 视图修改属性。使用的视图基于属性的类型，应用的 DataType 枚举的成员，或通过 UIHint 之类的明确方式。对于此处的属性，那将是 Int32.cshtml，因为它是一个整数。但是，我怀疑您是否想将此应用于每个 int 属性，因此您想要添加 [DataType(DataType.Password)] 或 [UIHint("Obfuscated")]，这将对应于 [=19] =] 或 Obfuscated.cshtml 视图。

这些视图将驻留在 Views\Shared\EditorTemplates 或 Pages\Shared\EditorTemplates 中，具体取决于您使用的样式。 UIHint 属性可以设置为任何值（我只是选择了 "Obfuscated"）。无论您放在那里，因为字符串就是相应的视图需要命名的内容。

现在，假设 none 这些事情是真的：没有 Int32.cshtml 编辑器模板视图，并且 DataType/UIHint 属性没有被应用，那么EditorFor 将回退到默认模板，这是因为 int 属性将是 "number" 类型的输入。在 ASP.NET MVC 5 中，只有通过传递一个带有 htmlAttributes 成员的匿名对象，才能在这些默认模板中设置 add/modify HTML 属性，该成员本身就是属性名称和值：

@Html.EditorFor(x => x.EmployeeId, new { htmlAttributes = new { type = "password" } })

我不确定这在 ASP.NET Core 中是否同样有效，因为我从来不需要尝试，但如果你愿意，你可以试一试。

不过，总的来说，无论如何只使用标签助手要好得多。除了使用 @Html.EditorFor(x => x.EmployeeId)，您还可以这样做：

<input asp-for="EmployeeId" />

然后，您可以通过以下方式轻松将其设为密码字段：

<input asp-for="EmployeeId" type="password" />

用星号屏蔽 EditorFor 模型的整数值

Masking an EditorFor Model's integer value with Asterisks

jquery

asp.net-core-2.0