Custom localization error

[TDSParticipant]

Hello,
i think we have some troubles with localization support.
I’ve made the following translation:

var Globalize;
if ( typeof require !== "undefined" &&
	typeof exports !== "undefined" &&
	typeof module !== "undefined" ) {
	// Assume CommonJS
	Globalize = require( "globalize" );
} else {
	// Global variable
	Globalize = window.Globalize;
}
Globalize.addCultureInfo( "de_DE", "default", {
	name: "de_DE",
	englishName: "Deutschland",
	nativeName: "Deutschland",
	language: "de",
	numberFormat: {
		decimals: 13,
		",": ".",
		".": ",",
		"NaN": "N/A",
		negativeInfinity: "-unendlich",
		positiveInfinity: "+unendlich",
		percent: {
			pattern: ["-n %","n %"],
			decimals: 13,
			",": ".",
			".": ","
		},
		currency: {
			pattern: ["-n $","n $"],
			decimals: 13,
			",": ".",
			".": ",",
			symbol: "€"
		}
	},
	calendars: {
		standard: {
			"/": ".",
			firstDay: 1,
			days: {
				// full day names
				names: [
					"Sonntag", "Montag",
					"Dienstag", "Mittwoch",
					"Donnerstag", "Freitag",
					"Sonnabend"
				],
				// abbreviated day names
				namesAbbr: [
					"So", "Mo",
					"Di", "Mi",
					"Do", "Fr",
					"Sa"
				],
				// shortest day names
				namesShort: [
					"So", "Mo",
					"Di", "Mi",
					"Do", "Fr",
					"Sa"
				]
			},
			months: {
				// full month names (13 months for lunar calendards -- 13th month should be "" if not lunar)
				names: [
					"Januar", "Februar",
					"März", "April",
					"Mai", "Juni",
					"Juli", "August",
					"September", "Oktober",
					"November", "Dezember",
					""
				],
				// abbreviated month names
				namesAbbr: [
					"Jan", "Feb",
					"Mrz", "Apr",
					"Mai", "Jun",
					"Jul", "Aug",
					"Sep", "Okt",
					"Nov", "Dez",
					""
				]
			},
			AM: null,
			PM: null,
			eras: [{"name":"n. Chr.","start":null,"offset":0}],
			patterns: {
				d: "dd.MM.yyyy",
				D: "dddd, d. MMMM yyyy",
				t: "HH:mm",
				T: "HH:mm:ss",
				f: "dddd, d. MMMM yyyy HH:mm",
				F: "dddd, d. MMMM yyyy HH:mm:ss",
				M: "dd MMMM",
				Y: "MMMM yyyy"
			}
		}
	}
});
function getLocalization()
{
	var localizationobj = {};
	localizationobj.pagergotopagestring = "Gehe zu:";
	localizationobj.pagershowrowsstring = "Zeige Zeile:";
	localizationobj.pagerrangestring = " von ";
	localizationobj.pagernextbuttonstring = "<< Zurück";
	localizationobj.pagerpreviousbuttonstring = "Weiter >>";
	localizationobj.sortascendingstring = "aufsteigend";
	localizationobj.sortdescendingstring = "absteigend";
	localizationobj.sortremovestring = "Sortierung entfernen";
	localizationobj.firstDay = 1;
	localizationobj.percentsymbol = "%";
	localizationobj.currencysymbol = "€";
	localizationobj.currencysymbolposition = "after";
	//localizationobj.decimalseparator = ",";
	//localizationobj.thousandsseparator = ".";
	var days = {
		// full day names
		names: [
			"Sonntag", "Montag",
			"Dienstag", "Mittwoch",
			"Donnerstag", "Freitag",
			"Sonnabend"
		],
		// abbreviated day names
		namesAbbr: [
			"So", "Mo",
			"Di", "Mi",
			"Do", "Fr",
			"Sa"
		],
		// shortest day names
		namesShort: [
			"So", "Mo",
			"Di", "Mi",
			"Do", "Fr",
			"Sa"
		]
	};
	localizationobj.days = days;
	var months = {
		// full month names (13 months for lunar calendards -- 13th month should be "" if not lunar)
		names: [
			"Januar", "Februar",
			"März", "April",
			"Mai", "Juni",
			"Juli", "August",
			"September", "Oktober",
			"November", "Dezember",
			""
		],
		// abbreviated month names
		namesAbbr: [
			"Jan", "Feb",
			"Mrz", "Apr",
			"Mai", "Jun",
			"Jul", "Aug",
			"Sep", "Okt",
			"Nov", "Dez",
			""
		]
	};
	var patterns = {
		d: "dd.MM.yyyy",
		D: "dddd, d. MMMM yyyy",
		t: "HH:mm",
		T: "HH:mm:ss",
		f: "dddd, d. MMMM yyyy HH:mm",
		F: "dddd, d. MMMM yyyy HH:mm:ss",
		M: "dd MMMM",
		Y: "MMMM yyyy"
	}
	localizationobj.patterns = patterns;
	localizationobj.months = months;
	localizationobj.todaystring = "heute";
	localizationobj.clearstring = "Löschen";
	return localizationobj;
}

After that:

	$("#trend-dat-form #date-start").jqxDateTimeInput({
		culture: "de_DE",
		showWeekNumbers: true,
		firstDayOfWeek: 1
	});
	$("#trend-dat-form #date-start").on("change", function(event) {
		var jsDate = event.args.date;
		$("#trend-dat-form #date-end").jqxDateTimeInput("setMinDate", jsDate);
	});
	$("#trend-dat-form #date-end").jqxDateTimeInput({
		culture: "de_DE",
		showWeekNumbers: true,
		firstDayOfWeek: 1
	});
	$("#trend-dat-form #date-end").on("change", function(event) {
		var jsDate = event.args.date;
		$("#trend-dat-form #date-start").jqxDateTimeInput("setMaxDate", jsDate);
		$("#trend-dat-panel-calendar").jqxCalendar("setRange", $("#trend-dat-form #date-start").jqxDateTimeInput("getDate"), jsDate);
	});
	$("#trend-dat-form #date-end").jqxCalendar("setMinDate", $("#trend-dat-form #date-start").jqxDateTimeInput("getDate"));

And the result is:
http://img15.myimg.de/localization7c034.png

It should be Sa followed by So.

Kind regards

[Peter StoevKeymaster]

Hi,

Here’s a sample with German Culture applied to the DateTimeInput. “SA” is followed by “SO”

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta name="keywords" content="jQuery Calendar, Month Calendar, MonthCalendar, DateTimeInput, DateTimePicker, Date Picker" /> 
    <meta name="description" content="jqxDateTimeInput provides support for localizing its input field and popup calendarfor different languages 
        and date formats. Each localization is contained within
        its own file with the language code appended to the name, e.g. globalize.culture.de-DE.js
        for German. The desired localization file should be loaded along with the jqxdatetimeinput.js.
        The localization is set to the jqxDateTimeInput instance by setting the jqxDateTimeInput's
        culture property."/>
    <title id='Description'>jqxDateTimeInput provides support for localizing its input field and popup calendarfor different languages 
        and date formats. Each localization is contained within
        its own file with the language code appended to the name, e.g. globalize.culture.de-DE.js
        for German. The desired localization file should be loaded along with the jqxdatetimeinput.js.
        The localization is set to the jqxDateTimeInput instance by setting the jqxDateTimeInput's
        culture property. </title>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript" src="../../scripts/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdatetimeinput.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcalendar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxtooltip.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="../../jqwidgets/globalization/globalize.js"></script>
    <script type="text/javascript" src="../../jqwidgets/globalization/globalize.culture.de-DE.js"></script>
</head>
<body>
    <div id='content'>
        <script type="text/javascript">
            $(document).ready(function () {
                // create a jqxDateTimeInput.
                $("#jqxDateTimeInput").jqxDateTimeInput({ culture: 'de-DE', firstDayOfWeek: 1, width: '250px', height: '25px'});
            });
        </script>
        <div style='width: 300px;' id='jqxWidget'>
            <div id='jqxDateTimeInput'>
            </div>
        </div>
    </div>
</body>
</html>

Hope this helps.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[hellyeahParticipant]

(function(window, undefined) {

var Globalize;

if (typeof require !== “undefined” &&
typeof exports !== “undefined” &&
typeof module !== “undefined”) {
// Assume CommonJS
Globalize = require(“globalize”);
} else {
// Global variable
Globalize = window.Globalize;
}

Globalize.addCultureInfo(“tr-TR”, “default”, {
name: “tr-TR”,
englishName: “Turkish (Turkey)”,
nativeName: “Türkçe (Türkiye)”,
language: “tr”,
numberFormat: {
“,”: “.”,
“.”: “,”,
“NaN”: “n. def.”,
negativeInfinity: “-unendlich”,
positiveInfinity: “+unendlich”,
percent: {
pattern: [“-n%”, “n%”],
“,”: “.”,
“.”: “,”
},
currency: {
pattern: [“-n $”, “n $”],
“,”: “.”,
“.”: “,”,
symbol: “€”
}
},
calendars: {
standard: {
“/”: “.”,
firstDay: 1,
days: {
names: [“Pazar”, “Pazartesi”, “Salı”, “Çarşamba”, “Perşembe”, “Cuma”, “Cumartesi”],
namesAbbr: [“Pa”, “Pz”, “Sa”, “Çr”, “Pr”, “Cu”, “Ct”],
namesShort: [“Pa”, “Pz”, “Sa”, “Çr”, “Pr”, “Cu”, “Ct”]
},
months: {
names: [“Ocak”, “Şubat”, “Mart”, “Nisan”, “Mayıs”, “Haziran”, “Temmuz”, “Ağustos”, “Eylül”, “Ekim”, “Kasım”, “Aralık”, “”],
namesAbbr: [“Oc”, “Şb”, “Mr”, “Ns”, “Ma”, “Hz”, “Tm”, “At”, “el”, “Ek”, “Ks”, “Al”, “”]
},
AM: null,
PM: null,
eras: [{
“name”: “n. Chr.”,
“start”: null,
“offset”: 0
}],
patterns: {
d: “dd.MM.yyyy”,
D: “dddd, d. MMMM yyyy”,
t: “HH:mm”,
T: “HH:mm:ss”,
f: “dddd, d. MMMM yyyy HH:mm”,
F: “dddd, d. MMMM yyyy HH:mm:ss”,
M: “dd MMMM”,
Y: “MMMM yyyy”
}
}
}
});

}(this));

$(“#jqxCalendar”).jqxCalendar({
width: ‘250px’,
height: ‘250px’,
theme: ‘darkblue’
});

$(“#jqxCalendar”).jqxCalendar({
culture: ‘tr-TR’
});
});

this is the way i did my calendar Turkish

[Author]

Posts