我正在尝试构建一个多语言MVC应用程序。我的应用程序中有一个表单,我有字段输入成本。我能够使用西班牙文化创建一个记录。
但是在尝试更新记录时,我得到了jquery验证错误。我收到一条默认错误消息:
该字段必须为数字。
在我的视图模型中,我设置了以下属性。
[LocalizedDisplayName("Label_Cost")]
[RegularExpression("^[^<>,<|>]+$", ErrorMessage = null, ErrorMessageResourceName = "Error_Message_Html_Tags_Prevented", ErrorMessageResourceType = typeof(Resources))]
[Range(0, 9999.99, ErrorMessage = null, ErrorMessageResourceName = "Error_Message_Cost_Not_Valid", ErrorMessageResourceType = typeof(Resources))]
public decimal? Cost { get; set; }
我已在我的Gobal.asax文件中设置了以下
protected void Application_AcquireRequestState(object sender, EventArgs e)
{
try
{
HttpCookie cookie = HttpContext.Current.Request.Cookies.Get("CurrentCulture");
string culutureCode = cookie != null && !string.IsNullOrEmpty(cookie.Value) ? cookie.Value : "en";
CultureInfo ci = new CultureInfo(culutureCode);
System.Threading.Thread.CurrentThread.CurrentUICulture = ci;
System.Threading.Thread.CurrentThread.CurrentCulture =
CultureInfo.CreateSpecificCulture(ci.Name);
}
catch(Exception ex)
{
// Code
}
}
并且上述方法在服务器端按预期工作以改变文化。但是客户端验证打破了非英语文化,因为javascript只识别十进制文字。我想知道使用特定于文化的验证来扩展mvc客户端验证的最佳方法。
修改
参考Mike的网址,我在Js包中进行了以下更改。 Js包如下
public static void RegisterBundles(BundleCollection bundles)
{
BundleTable.EnableOptimizations = true;
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/globalisation").Include(
"~/Scripts/globalize.js",
"~/Scripts/globalize/currency.js",
"~/Scripts/globalize/date.js",
"~/Scripts/globalize/message.js",
"~/Scripts/globalize/number.js",
"~/Scripts/globalize/plural.js",
"~/Scripts/globalize/relative-time.js"));
bundles.Add(new ScriptBundle("~/bundles/globalisationEN").Include(
"~/Scripts/GlobalisationCulture/globalize.culture.en-AU.js"));
bundles.Add(new ScriptBundle("~/bundles/globalisationES").Include(
"~/Scripts/GlobalisationCulture/globalize.culture.es-AR.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryuiEN").Include(
"~/Scripts/jquery-ui-1.10.3.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryuiES").Include(
"~/Scripts/jquery-ui-1.10.3.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.validate.js",
"~/Scripts/jquery.validate.unobtrusive.js",
"~/Scripts/jquery.unobtrusive-ajax.js",
"~/Scripts/jquery.validate.globalize.js"));
}
在布局页面中我实现了如下
HttpCookie cookie = HttpContext.Current.Request.Cookies.Get("CurrentCulture");
string culutureCode = cookie != null && !string.IsNullOrEmpty(cookie.Value) ? cookie.Value : "en";
if (culutureCode.Equals("en-AU", StringComparison.OrdinalIgnoreCase))
{
culutureCode = "EN";
}
else if (culutureCode.Equals("es-AR", StringComparison.OrdinalIgnoreCase))
{
culutureCode = "ES";
}
else
{
culutureCode = "EN";
}
@Scripts.Render("~/bundles/jquery",
"~/bundles/globalisation",
string.Format("~/bundles/globalisation{0}", culutureCode),
"~/bundles/jqueryval",
string.Format("~/bundles/jqueryui{0}", culutureCode))
答案 0 :(得分:24)
有2个jQuery Globalize插件。
旧版本v0.0.1包含一个脚本globalize.js
,它有一个子文件夹cultures
,您可以在其中找到所有脚本文化,例如:
这些脚本允许您添加任意数量的文化,因此以这种方式构建捆绑包是完全可以的:
bundles.Add(new ScriptBundle("~/bundles/globalisation").Include(
"~/Scripts/globalize.js",
"~/Scripts/cultures/globalize.culture.en-AU.js",
"~/Scripts/cultures/globalize.culture.es-AR.js"
));
Globalize
将有一组本地化脚本,您可以使用以下方式设置:
Globalize.culture('en-AU');
或
Globalize.culture('es-AR');
它可以使用某种接近来找出你想要使用的最接近的文化。
如果您已加载捆绑globalize.culture.es-AR.js
,则可以设置Globalize.culture('es');
,Globalize
可以确定您要使用&#39; es-AR&#39;文化;当然,如果您添加了globalize.culture.es.js
,则加载程序会选择最后一个。
新版本的jQuery Globalize(稳定版)是v1.0.0,它的工作方式完全不同。
它仍然有一个名为globalize.js
的主脚本文件,但您必须添加更多脚本才能使其正常工作。
有人建立了一个tool,它会告诉您确切需要哪个脚本,具体取决于您要使用的模块类型(数量,日期,货币)。
如果您选择使用v1.0.0,您会看到该工具会建议包含基本脚本(仅限数字):
加上一些CLDR JSON脚本:
您可以在core包和numbers包中找到这些文件 如果您想验证日期,则这是package。 更多信息here。
这些都是json文件,你不能捆绑它们。您可以在运行时加载它们,执行以下操作:
Application.loadCulture = function (culture) {
$.when(
$.get(Application.CldrFetch + '/' + culture + '/' + encodeURIComponent("likelySubtags.json")),
$.get(Application.CldrFetch + '/' + culture + '/' + "numberingSystems.json"),
$.get(Application.CldrFetch + '/' + culture + '/' + "plurals.json"),
$.get(Application.CldrFetch + '/' + culture + '/' + "ordinals.json"),
$.get(Application.CldrFetch + '/' + culture + '/' + "currencyData.json"),
$.get(Application.CldrFetch + '/' + culture + '/' + "timeData.json"),
$.get(Application.CldrFetch + '/' + culture + '/' + "weekData.json"),
$.get(Application.CldrFetch + '/' + culture + '/' + "ca-gregorian.json"),
$.get(Application.CldrFetch + '/' + culture + '/' + "timeZoneNames.json"),
$.get(Application.CldrFetch + '/' + culture + '/' + "numbers.json"),
$.get(Application.CldrFetch + '/' + culture + '/' + "currencies.json")
)
.then(function () {
// Normalize $.get results, we only need the JSON, not the request statuses.
return [].slice.apply(arguments, [0]).map(function (result) {
return result[0];
});
}).then(Globalize.load).then(function () {
Globalize.locale(culture);
});
};
反正;让我们说你想坚持旧的v0.0.1,这仍然是最好的 您的捆绑包将包含全球化脚本和文化脚本:
bundles.Add(new ScriptBundle("~/bundles/globalisation").Include(
"~/Scripts/globalize.js",
"~/Scripts/cultures/globalize.culture.en-AU.js",
"~/Scripts/cultures/globalize.culture.es-AR.js"
));
jQuery validation提供了一些您可能需要考虑的其他附加扩展程序:
我已经看到你在Application_AcquireRequestState
中设置了自己的文化。有人建议在Application_BeginRequest
中进行此操作会更好,因为它是在管道中先前处理的:
protected void Application_BeginRequest(object sender, EventArgs e)
{
HttpCookie cookie = HttpContext.Current.Request.Cookies.Get("CurrentCulture");
string cultureCode = cookie != null && !string.IsNullOrEmpty(cookie.Value) ? cookie.Value : "en";
CultureInfo ci = new CultureInfo(cultureCode);
System.Threading.Thread.CurrentThread.CurrentCulture = new System.Globalization.CultureInfo(cultureCode);
System.Threading.Thread.CurrentThread.CurrentUICulture = System.Threading.Thread.CurrentThread.CurrentCulture;
}
您似乎正在使用此jQuery plugin进行验证。我通常会做的是,一旦我加载脚本,配置文化并设置自定义验证:
Globalize.culture(this.culture);
$.validator.methods.number = function (value, element) {
return this.optional(element) || jQuery.isNumeric(Globalize.parseFloat(value));
};
$.validator.methods.date = function (value, element) {
return (this.optional(element) || Globalize.parseDate(value));
};
jQuery.extend(jQuery.validator.methods, {
range: function (value, element, param) {
var val = Globalize.parseFloat(value);
return this.optional(element) || (val >= param[0] && val <= param[1]);
}
});
您遗失的一件事是小数的模型绑定器:
using System;
using System.Web.Mvc;
using System.Globalization;
public class DecimalModelBinder : IModelBinder
{
public object BindModel(ControllerContext controllerContext, ModelBindingContext bindingContext)
{
ValueProviderResult valueResult = bindingContext.ValueProvider.GetValue(bindingContext.ModelName);
ModelState modelState = new ModelState { Value = valueResult };
object actualValue = null;
try
{
//Check if this is a nullable decimal and a null or empty string has been passed
var isNullableAndNull = (bindingContext.ModelMetadata.IsNullableValueType && string.IsNullOrEmpty(valueResult.AttemptedValue));
//If not nullable and null then we should try and parse the decimal
if (!isNullableAndNull)
{
actualValue = decimal.Parse(valueResult.AttemptedValue, NumberStyles.Any, CultureInfo.CurrentCulture);
}
}
catch (FormatException e)
{
modelState.Errors.Add(e);
}
bindingContext.ModelState.Add(bindingContext.ModelName, modelState);
return actualValue;
}
}
可以在Global.asax Application_Start
中设置:
ModelBinders.Binders.Add(typeof(decimal), new DecimalModelBinder());
ModelBinders.Binders.Add(typeof(decimal?), new DecimalModelBinder());
这几乎是你需要的一切。
这种方法只会引起恼人的问题
让我们假设你正在使用文化en-AU
,并在数字字段中输入一个值:10,4。
此数字在es-AR
中完全有效,但对en-AU
文化无效。
jQuery Globalize无论如何都会认为它有效,因为它会将它转换为104:
$.validator.methods.number = function (value, element) {
return this.optional(element) || jQuery.isNumeric(Globalize.parseFloat(value));
};
Globalize.parseFloat('10,4')
对于文化en-AU会将该数字转换为104。
如果对文化es-AR Globalize.parseFloat('10.4')
做同样的事情,也会发生同样的事情;它将再次成为104。
您可以检查运行此fiddle的此行为。
,
和.
都是有效符号,因为它们将用作小数点分隔符和千位分隔符。
关于这个主题在github上有一些问题已经公开,我想这很难修复,因为他们现在正在开发新版本,顺便说一下同样的问题仍然存在。
您使用我们的decimal model binder在服务器端遇到同样的问题:
decimal.Parse('10,4', NumberStyles.Any, CultureInfo.CurrentCulture);
CultureInfo.CurrentCulture是&#39; en-AU&#39;会再次产生相同的结果: 104 。
它可以在那里放置断点并查看它如何转换值。
我想这可能更容易修复,也许使用一些正则表达式。
如果您想使用jQuery Validator v.0.1.1或jQuery Validator v.1.0.0解决方案,我已经创建了两个存储库here和here。
答案 1 :(得分:1)
您已在RegisterBundles中添加了捆绑包,但未在布局页面中使用它们。您还在RegisterBundles中添加了冗余jqueryui文件。 更新您的RegisterBundles方法,如下所示:
public static void RegisterBundles(BundleCollection bundles)
{
BundleTable.EnableOptimizations = true;
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/globalisation").Include(
"~/Scripts/globalize.js",
"~/Scripts/globalize/currency.js",
"~/Scripts/globalize/date.js",
"~/Scripts/globalize/message.js",
"~/Scripts/globalize/number.js",
"~/Scripts/globalize/plural.js",
"~/Scripts/globalize/relative-time.js"));
bundles.Add(new ScriptBundle("~/bundles/globalisationEN").Include(
"~/Scripts/GlobalisationCulture/globalize.culture.en-AU.js"));
bundles.Add(new ScriptBundle("~/bundles/globalisationES").Include(
"~/Scripts/GlobalisationCulture/globalize.culture.es-AR.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
"~/Scripts/jquery-ui-1.10.3.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.validate.js",
"~/Scripts/jquery.validate.unobtrusive.js",
"~/Scripts/jquery.unobtrusive-ajax.js",
"~/Scripts/jquery.validate.globalize.js"));
}
然后更新布局页面如下:
@section Scripts
{
@Scripts.Render("~/bundles/jquery",
"~/bundles/globalisation",
"~/bundles/globalisationEN",
"~/bundles/globalisationES",
"~/bundles/jqueryval",
"~/bundles/jqueryui"))
<script type="text/javascript">
$.validator.methods.number = function (value, element) {
return this.optional(element) ||
!isNaN(Globalize.parseFloat(value));
}
$(document).ready(function () {
Globalize.culture('es-AR'); //set spanish culture
});
</script>
}
希望这会有所帮助:)