Your search did not match any results.
Localization

Using Globalize

Documentation
DevExtreme ASP.NET MVC Controls can be localized by means of Globalize. Globalize modules and CLDR scripts are already added to your project along with other resources for DevExtreme ASP.NET MVC Controls. Do the following to use them:
  1. In your controller, create an action method that loads CLDR data for desired locales. See the CldrData() action method in LocalizationController.cs.
  2. Create a section on the view with DevExtreme ASP.NET MVC Controls to localize and call the action method from it. In the same section, link DevExtreme dictionaries for the desired locales. See the Localization section in UsingGlobalize.cshtml.
  3. Add the following command to the <head> tag of the shared layout view. The view is not shown in this demo.
    @RenderSection('Localization', false)
  4. Set the current locale using the Globalize.locale method. See the <script> tag in UsingGlobalize.cshtml.
@section Localization { <script src="@Url.Action( "CldrData", "Localization", new { t = CldrDataScriptBuilder.GetCacheParam() })"></script> <script src="~/lib/devextreme/js/localization/dx.messages.de.js"></script> <script src="~/lib/devextreme/js/localization/dx.messages.ru.js"></script> } @model IEnumerable<DevExtreme.NETCore.Demos.Models.Payment> <div id="data-grid-demo"> @(Html.DevExtreme().DataGrid() .DataSource(Model) .Columns(columns => { columns.Add().DataField("PaymentId") .Width(100) .AllowEditing(false); columns.Add().DataField("ContactName"); columns.Add().DataField("CompanyName"); columns.Add().DataField("Amount") .DataType(GridColumnDataType.Number) .Format(Format.Currency); columns.Add().DataField("PaymentDate") .DataType(GridColumnDataType.Date); }) .FilterRow(filterRow => filterRow .Visible(true) .ApplyFilter(GridApplyFilterMode.Auto) ) .Editing(c => c .Mode(GridEditMode.Popup) .AllowUpdating(true) .Popup(e => e .Width(700) .Height(345) ) ) ) <div class="options"> <div class="caption">Options</div> <div class="option"> <label for="selectInput">Language</label> @(Html.DevExtreme().SelectBox() .ID("selectBox") .InputAttr("id", "selectInput") .DataSource(new JS("locales")) .DisplayExpr("name") .ValueExpr("value") .Value(new JS("locale")) .OnValueChanged("changeLocale") ) </div> </div> </div> <script> var locale = getLocale(); var locales = [ { name: "English", value: "en" }, { name: "Deutsch", value: "de" }, { name: "Русский", value: "ru" } ]; Globalize.locale(locale); function changeLocale(data) { setLocale(data.value); document.location.reload(); } function getLocale() { var locale = sessionStorage.getItem("locale"); return locale != null ? locale : "en"; } function setLocale(locale) { sessionStorage.setItem("locale", locale); } </script>
using DevExtreme.AspNet.Mvc; using DevExtreme.NETCore.Demos.Models.SampleData; using Microsoft.AspNetCore.Mvc; using System.Linq; namespace DevExtreme.NETCore.Demos.Controllers { public class LocalizationController : Controller { public ActionResult UsingGlobalize() { return View(SampleData.Payments); } public ActionResult CldrData() { return new CldrDataScriptBuilder() .SetCldrPath("~/wwwroot/cldr-data") .UseLocales(new[] { "de", "ru" }) .Build(); } } }
using System; using System.Collections.Generic; using System.Linq; namespace DevExtreme.NETCore.Demos.Models { public class Payment { public int PaymentId { get; set; } public string ContactName { get; set; } public string CompanyName { get; set; } public int Amount { get; set; } public DateTime PaymentDate { get; set; } } }
using System; using System.Collections.Generic; namespace DevExtreme.NETCore.Demos.Models.SampleData { public partial class SampleData { public static List<Payment> Payments { get { return new List<Payment> { new Payment { PaymentId = 1, ContactName = "Nancy Davolio", CompanyName = "Premier Buy", Amount = 1740, PaymentDate = DateTime.Parse("2013/01/06") }, new Payment { PaymentId = 2, ContactName = "Andrew Fuller", CompanyName = "ElectrixMax", Amount = 850, PaymentDate = DateTime.Parse("2013/01/13") }, new Payment { PaymentId = 3, ContactName = "Janet Leverling", CompanyName = "Video Emporium", Amount = 2235, PaymentDate = DateTime.Parse("2013/01/07") }, new Payment { PaymentId = 4, ContactName = "Margaret Peacock", CompanyName = "Screen Shop", Amount = 1965, PaymentDate = DateTime.Parse("2013/01/03") }, new Payment { PaymentId = 5, ContactName = "Steven Buchanan", CompanyName = "Braeburn", Amount = 880, PaymentDate = DateTime.Parse("2013/01/10") }, new Payment { PaymentId = 6, ContactName = "Michael Suyama", CompanyName = "PriceCo", Amount = 5260, PaymentDate = DateTime.Parse("2013/01/17") }, new Payment { PaymentId = 7, ContactName = "Robert King", CompanyName = "Ultimate Gadget", Amount = 2790, PaymentDate = DateTime.Parse("2013/01/21") }, new Payment { PaymentId = 8, ContactName = "Laura Callahan", CompanyName = "EZ Stop", Amount = 3140, PaymentDate = DateTime.Parse("2013/01/01") }, new Payment { PaymentId = 9, ContactName = "Anne Dodsworth", CompanyName = "Clicker", Amount = 6175, PaymentDate = DateTime.Parse("2013/01/24") }, new Payment { PaymentId = 10, ContactName = "Clark Morgan", CompanyName = "Store of America", Amount = 4575, PaymentDate = DateTime.Parse("2013/01/11") } }; } } } }
#data-grid-demo { min-height: 540px; } .options { padding: 20px; background-color: rgba(191, 191, 191, 0.15); position: absolute; bottom: 0; left: 0; right: 0; } .option { margin-top: 10px; } .caption { font-size: 18px; font-weight: 500; } .option > label { margin-right: 10px; } .option > .dx-selectbox { display: inline-block; vertical-align: middle; }