重要な3つのことがあります：
- フォーム内の日時フィールドをレンダリングするときに使用される形式
- クライアントの日時フィールドを検証するために使用される形式
- サーバーの日時フィールドを検証するために使用される形式
理想的には、これら3つの形式は同じである必要があります。ギリシャ文化を使用しているとおっしゃっていたので、web.configでこれを構成することから始めることができます。
<globalization culture="el-GR" uiCulture="el-GR"/>
この段階で、日時フィールドを表示し、サーバーで日時フィールドを検証するdd/MM/yyyyための形式は、el-GRカルチャで使用される形式であるためです。
クライアント側の検証は別の話です。サーバー構成の影響を受けません。これは、クライアントブラウザの設定と文化に影響されます。したがって、カルチャel-GRを使用するように構成されたクライアントブラウザーがある場合は、日時の検証に使用するようにサーバーを構成した場合でも、クライアントの検証ではその形式が使用されます。en-USMM/dd/yyyy
クライアント検証が最初に実行されるため（jqueryの控えめな検証を有効にしていると仮定）、en-US形式が使用され、20/06/2012値がサーバー側カルチャに対して有効であっても、クライアントカルチャに対しては無効です。この問題に対処するには、jquery.globalizeプラグインを使用する必要があります。したがって、ここでカルチャを操作したい場合el-GRは、HTMLドキュメントの最後に追加する必要のあるスクリプトを次に示します。
<script type="text/javascript" src="~/Scripts/jquery-1.8.2.js"></script>
<script type="text/javascript" src="~/Scripts/jquery.validate.js"></script>
<script type="text/javascript" src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script type="text/javascript" src="~/Scripts/globalize.js"></script>
<script type="text/javascript" src="~/Scripts//globalize.culture.el-GR.js"></script>
<script type="text/javascript">
$.validator.methods.date = function (value, element) {
return this.optional(element) ||
!isNaN(Globalize.parseDate(value));
}
$.validator.methods.number = function (value, element) {
return this.optional(element) ||
!isNaN(Globalize.parseFloat(value));
}
Globalize.culture('el-GR');
</script>
これらの値を解析するときにプラグインを使用するために、プラグインのメソッドdateとnumberメソッドがどのようにjquery.validateオーバーライドされるかに注意してください。jquery.globalize
もちろん、ページ内にたくさんのスクリプトがあるのは良いことではありません。ASP.NET MVC 4では、それらをバンドルできます。
BundleTable.Bundles.Add(
new ScriptBundle("~/bundles/scripts")
.Include("~/Scripts/jquery-1.8.2.js")
.Include("~/Scripts/jquery.validate.js")
.Include("~/Scripts/jquery.validate.unobtrusive.js")
.Include("~/Scripts/globalize.js")
.Include("~/Scripts/globalize.culture.el-GR.js")
.Include("~/Scripts/myscript.js")
);
ここmyscript.jsに、オーバーライドされた検証メソッドが含まれます。
$.validator.methods.date = function (value, element) {
return this.optional(element) ||
!isNaN(Globalize.parseDate(value));
}
$.validator.methods.number = function (value, element) {
return this.optional(element) ||
!isNaN(Globalize.parseFloat(value));
}
Globalize.culture('el-GR');
これで、レイアウトのすべてのスクリプトを単一のバンドルインクルードに置き換えることができます。
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
...
@Scripts.Render("~/bundles/scripts")
</body>
</html>
最後のステップは、入力フィールド内の日時フィールドの値をレンダリングするときに使用される形式に対処することです。ヘルパーを使用Html.EditorFor()して対応するモデルプロパティの入力フィールドを生成する場合、このヘルパーはデフォルトで現在のカルチャを使用します。たとえば、DateTimeフィールドがありel-GR、web.configでカルチャをに設定している場合、値は次のようにレンダリングされます。
20/10/2012 12:21:22 μμ
時間部分を削除する場合は、ビューモデルのDateTimeフィールドを[DisplayFormat]属性で装飾し、使用するカスタム形式を指定できます。
[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}", ApplyFormatInEditMode = true)]
public DateTime SomeDateField { get; set; }
これは、値をレンダリングするときに使用される形式のみを指定することに注意してください。以前に取り上げた検証と混同しないでください。