We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
|
npm install cldr-data |
|
<div class="col-lg-8 control-section">
<div id="wrapper">
<div id="calender-control">
@Html.EJS().Calendar("calendar").Change("startDate").Render()
<br>
<span id="date_label"> Selected Value: </span>
</div>
</div>
</div>
<div id="propertySection" class="col-lg-4 property-section">
<div class="radio-control" id="property" title="Select a Locale">
<div class="row">
@Html.EJS().RadioButton("en").Label("English").Name("locale").Value("en").Change("onLocaleChange").Render()
</div>
<div class="row">
@Html.EJS().RadioButton("de").Label("German").Name("locale").Value("de").Change("onLocaleChange").Checked(true).Render()
</div>
<div class="row">
@Html.EJS().RadioButton("ar").Label("Arabic").Name("locale").Value("ar").Change("onLocaleChange").Render()
</div>
</div>
</div>
<script>
function startDate(args) {
/*Displays selected date in the label*/
(document.getElementById('date_label')).textContent = 'Selected Value: ' + args.value.toLocaleDateString();
}
function onLocaleChange(args) {
/*Apply selected format to the component*/
var culture = args.value;
calendarObject.locale = culture;
calendarObject.enableRtl = calendarObject.locale === 'ar' ? true : false;
if (culture !== 'en') {
loadCultureFiles(culture);
}
globalize = new ej.base.Internationalization(calendarObject.locale);
if (calendarObject.value) {
var dateString = globalize.formatDate(calendarObject.value);
(document.getElementById('date_label')).textContent = 'Selected Value: ' + dateString;
}
}
document.addEventListener('DOMContentLoaded', function () {
calendarObject = document.getElementById('calendar').ej2_instances[0];
var L10n = ej.base.L10n;
L10n.load({
"de": {
"calendar": {
"today": "heute"
}
},
"en": {
"calendar": {
"today": "Today"
}
},
"ar": {
"calendar": {
"today": "اليوم"
}
},
});
loadCultureFiles('de');
calendarObject.locale = 'de';
});
function loadCultureFiles(name) {
var files = ['ca-gregorian.json', 'numbers.json', 'timeZoneNames.json'];
if (name === 'ar') {
files.push('numberingSystems.json');
}
var loader = ej.base.loadCldr;
var loadCulture = function (prop) {
var val, ajax;
if (name === 'ar' && prop === files.length - 1) {
ajax = new ej.base.Ajax(location.origin + location.pathname + '/../../scripts/cldr-data/supplemental/' + files[prop], 'GET', false);
} else {
ajax = new ej.base.Ajax(location.origin + location.pathname + '/../../scripts/cldr-data/main/' + name + '/' + files[prop], 'GET', false);
}
ajax.onSuccess = function (value) {
val = value;
};
ajax.send();
loader(JSON.parse(val));
};
for (var prop = 0; prop < files.length; prop++) {
loadCulture(prop);
}
}
</script> |
