MVC Controls Toolkit

Globalization

Mvc Controls Toolkit extends the predefined client side validation of MVC to allow globalization of input formats. Moreover, all validation attributes defined in the MVC Controls Toolkit supports globalization.

Globalization support may come either from the Old Ajax Microsoft javascript library or by JQuery  globalization library. The toolkit automatically detects which globalization library is used with no need for further settings to be specified.

MVC2 users and in general users that take advantage of Old Microsoft Validation library are required to use Old Microsoft Ajax Globalization library, while users of MVC 3 with JQuery Ajax and validation enabled are required to use JQuery validation library.

Below the headers required to add Microsoft Ajax library globalization, and validation:

    <% AjaxHelper.GlobalizationScriptPath = "http://ajax.microsoft.com/ajax/4.0/1/globalization/"; %>
    <%: Ajax.GlobalizationScript() %>
    <script type='text/javascript' src="../../Scripts/jquery-1.6.1.min.js"></script>
    <script type='text/javascript' src="../../Scripts/MicrosoftAjax.js"></script>
    <script type='text/javascript' src="../../Scripts/MicrosoftMvcAjax.js"></script>
    <script type='text/javascript' src="../../Scripts/MicrosoftMvcValidation.js"></script>
    <script type='text/javascript' src="../../Scripts/MVCControlToolkit.Controls-x.x.x.min.js"></script>

The AjaxHelper.GlobalizationScripthPath must contain the the url of a folder containing all js files with the specific information of all cultures. In the example I used an URL of the Microsoft CDN. If you would like to copy in your web site those files you need to copy them fom that path because I was not able to find them elsewhere.

Below the headers required to add JQuery library Ajax, globalization, and validation, based on the Globalize library:

    <script type='text/javascript' src="../../Scripts/jquery-1.6.1.min.js"></script>
    <script type='text/javascript' src="../../Scripts/jquery-ui-1.8.9.custom.min.js"></script>
    <script type='text/javascript' src="../../Scripts/jquery.validate-1.8.1.min.js"></script>
    <script type='text/javascript' src="../../Scripts/jquery.validate.unobtrusive.min.js"></script>
    <script type='text/javascript' src="../../Scripts/jquery.unobtrusive-ajax.min.js"></script>
    <script type='text/javascript' src="../../Scripts/globalize.min.js"></script>
    
    <%: Html.GlobalizationScript() %>
    <%: Html.JQueryDatePickerGlobalizationScript() %>
    
    
    <script type='text/javascript' src="../../Scripts/MVCControlToolkit.Controls-2.2.0.min.js"></script>

The above assumes that the cultures folder containing all js files with the culture specific information is located in the "script" folder of the web site.

If the path is different it needs to be passed as value of the optional argument of the Html.GlobalizationScript function, whose exact definition is:

public static MvcHtmlString GlobalizationScript(this HtmlHelper htmlHelper, string globalizationFolder = "~/Scripts/cultures/")

The Html.JQueryDatePickerGlobalizationScrip() is needed just if one uses the jQuery datepicker someway, Pleace notice that the jQuery DatePicker is automatically used by some overlkoads of the TypedTextBox and of the DateTimeInput. The above calls uses the localization files contained in  “~/Scripts/cultures/datepicker/". If do you want to copy the in a local folder, please use this different overloads, that allows the specification of the folder path:

In order to use all the above methods one is required to include the namespace:MVCControlsToolkit.Controls.Validation: If the Mvc Controls Toolkit is installed through Nuget this namespace is included among the default ones, so you don't need to include it in all pages.

The MVCControlsToolkit.Controls.Validation namespace contains also an helper to support a generic globalization script:

Where sourceFormat is a format string with an unique “hole” {0} where to put either the two letter language code or the 5 letters language-Country code, according to the value returned by useCountry function.

There is also another more complex overload where the format string is returned by a function that receives as input the 5 letters language-Country code of the current culture:

We continue to support also the jquery.global library. Below the settings for this library.

    <script type='text/javascript' src="../../Scripts/jquery-1.6.1.min.js"></script>
    <script type='text/javascript' src="../../Scripts/jquery.validate-1.8.1.min.js"></script>
    <script type='text/javascript' src="../../Scripts/jquery.validate.unobtrusive.min.js"></script>
    <script type='text/javascript' src="../../Scripts/jquery.unobtrusive-ajax.min.js"></script>
    <script type='text/javascript' src="../../Scripts/jquery.global.js"></script>
    <%: Html.jQueryGlobalizationScript() %>
    <script type='text/javascript' src="../../Scripts/MVCControlToolkit.Controls-x.x.x.min.js"></script>

The above assumes that the globinfo folder containing all js files with the culture specific information is located in the "script" folder of the web site.

If the path is different it needs to be passed as value of the optional argument of the Html.jQueryGlobalizationScript function, whose exact definition is:

public static MvcHtmlString jQueryGlobalizationScript(this HtmlHelper htmlHelper, string globalizationFolder = "~/Scripts/globinfo/")

With one of the above in place, for instance in the master page, the user is able to insert numbers, dates, and currencies according to his  culture server settings.