MVC/JQuery验证不接受逗号作为小数分隔符

Question

更新07.01.2018

即使有人提出,这是一个jQuery问题而不是MVC问题,我认为这是一个MVC问题.我已经在asp.net core 2.0 MVC中创建了整个应用程序并且错误仍然存​​在.将它与MVC联系起来的是,我可以通过向[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]模型添加行来解决日期验证问题.因此,MVC对验证有影响.所以我会假设有在MVC某种方式来解决这个问题(见这个职位).请发布asp.net core 2.0的答案.

原帖

在MVC5页面中,我Double在文本框中渲染一个属性.加载页面时,该值显示为","作为小数分隔符,这是正确的,因为页面在德语系统上运行.如果我想保存表单,我会收到验证错误.怎么解决这个问题？我知道关于这个话题有一些问题,但据我所知,其中大部分已经过时了...我仍然在苦苦挣扎,没有设置或任何内置的东西允许来自不同国家的用户使用MVC应用程序.

模型:

[DisplayFormat(DataFormatString = "{0:n2}", ApplyFormatInEditMode = true)]
public Double Gewicht
{
    get { return gewicht; }
    set { gewicht = value; OnPropertyChanged(new PropertyChangedEventArgs("Gewicht")); }
}

CSHTML:

<div class="form-group">
    @Html.LabelFor(model => model.Gewicht, htmlAttributes: new { @class = "control-label col-md-3" })
    <div class="col-md-8">
        @Html.EditorFor(model => model.Gewicht, new { htmlAttributes = new { @class = "form-control col-md-1" } })
        @Html.ValidationMessageFor(model => model.Gewicht, "", new { @class = "text-danger" })
    </div>
</div>

Web.config文件

<globalization uiCulture="de-DE" culture="de-DE" />

加载后的框 - >用逗号作为小数分隔符加载的值

单击提交按钮后的框 - >相同值的验证错误

逗号后的框更改为点 - >无验证错误

更新05.01.2018

我尝试过这里显示的解决方案,遗憾的是这对我不起作用.但是,我还发现,这些值不仅不被接受,而且还被改为组分隔符和小数分隔符混合的数字(见图).会发生的是,22的值变为22.5并存储在数据库中.结果是,将值2,250.00存储到数据库中.

更新07.01.2018

同样有趣的是,日期字段完全可以接受德语格式.

属性

private DateTime? inbetriebnahmedatum;

[DataType(DataType.Date)]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]
public DateTime? Inbetriebnahmedatum
{
    get { return inbetriebnahmedatum; }
    set { inbetriebnahmedatum = value; OnPropertyChanged(new PropertyChangedEventArgs("Inbetriebnahmedatum")); }
}

接受并处理下面显示的值没有任何错误.

更新07.01.2018 - 2

如果我更改edit.cshtml中的行

<input asp-for="Gewicht" class="form-control" />

至

<input name="Gewicht" id="Gewicht" type="number" class="form-control" value="@Model.Gewicht"/>

表单可以使用值"23,7"提交,不会出现验证错误.在控制器中,绑定模型属性显示值"237",其中IFormCollection显示值"23.7".这表明模型绑定器存在问题.

Answer 1

即使有人提出,这是一个jQuery问题而不是MVC问题,我认为这是一个MVC问题.

不,那是不正确的.您看到客户端验证错误,因为默认情况下jquery.validate.js(MVC用于客户端验证的与MicroSoft无关的独立第三方插件)根据小数分隔符.(点)而不是,(逗号)验证数字.

MVC是服务器端代码,不在浏览器中运行.为了执行客户端验证,MVC HtmlHelper生成表单控件的方法data-val-*在html中呈现一组属性,用于描述要执行的验证,然后在jquery.validate.unobtrusive.js加载DOM时由插件解析,并使用这些属性添加规则这个$.validator.

对于您的double属性,它将添加一个data-val-number属性(除了data-val-required属性),它将添加number定义为的规则

// http://docs.jquery.com/Plugins/Validation/Methods/number
number: function( value, element ) {
    return this.optional(element) || /^-?(?:\d+|\d{1,3}(?:,\d{3})+)?(?:\.\d+)?$/.test(value);
},

其中小数点分隔符是一个点,千位分隔符是逗号(可能是因为该插件是在美国开发的,所以使用美国格式).

您需要覆盖使用jquery.globalize等插件或包含以下脚本可以执行的默认行为(请注意正则表达式只是交换点和逗号)

$.validator.methods.number = function (value, element) {
    return this.optional(element) || /^-?(?:\d+|\d{1,3}(?:\.\d{3})+)?(?:,\d+)?$/.test(value);
}

请注意,上面的脚本需要在jquery.validate.js脚本之后但不包含在内$(document).ready()

将它与MVC联系起来的是,我可以通过向[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]模型添加行来解决日期验证问题.

它实际上是你的[DataType(DataType.Date)]属性与[DisplayFormat]影响生成的html 的属性相结合.所述[DataType]属性生成<input type="date" ... />这又使浏览器的HTML-5日期选择器如果浏览器支持它.根据规范,格式必须是yyyy-MM-dd(ISO格式),因此也需要[DisplayFormat]属性.

HTML-5日期选择器在浏览器文化中呈现日期.您输入的图像26.1.2018是因为您的浏览器文化是de-DE,但如果我导航到您的网站,我会26/1/2018在输入中看到,因为我的文化是en-AU(澳大利亚),如果美国用户导航到您的网站,他们会看到1/26/2018.

客户端验证适用于date属性的原因是该jquery.validate.js插件包含US format(MM/dd/yyyy)和ISO format(yyyy-MM-dd)的日期规则.

如果你使用@Html.TextBoxFor(m => m.Inbetriebnahmedatum)(而忽略你[DataType]和[DisplayFormat]属性),并进入26.1.2018输入,你也将看到一个客户端验证错误.

Answer 2

我认为问题是我使用的 jquery 验证器来解决逗号/点错误

$.validator.methods.number = function (value, element) {
    return this.optional(element) || /^-?(?:\d+|\d{1,3}(?:[\s\.,]\d{3})+)(?:[\.,]\d+)?$/.test(value);
}

尝试玩一下