atul.sachan@capgemini.com
4 Jan 2012, 11:30 PM
I am trying to localize labels but it is not working for me. any one can suggest what is wrong here ??
dutch-form.html
---------------------start-------------------------------------------------
<!--<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">-->
<html lang="nl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Dutch Form</title>
<!-- Ext -->
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/ext-debug.js"></script>
<!-- Example -->
<link rel="stylesheet" type="text/css" href="extjs/examples/shared/example.css" />
<script type="text/javascript" src="extjs/examples/shared/examples.js"></script>
<!-- <script type="text/javascript" src="extjs/locale/ext-lang-nl.js"></script> -->
<script type="text/javascript" src="ContactForm-nl.js"></script>
<script type="text/javascript" src="dutch-provinces.js"></script>
<script type="text/javascript" src="ContactForm.js"></script>
</head>
<body>
<h1>Localization with Ext</h1>
<p>The js is not minified so it is readable. See <a href="ContactForm.js">ContactForm.js</a> and <a href="ContactForm-nl.js">ContactForm-nl.js</a>.</p>
</body> </html>
-----------------------------------End dutch-form.html-------------------------------------------
dutch-provinces.js
------------------------------------------------------------------
if (Ext.app.ContactForm) {
Ext.apply(Ext.app.ContactForm.prototype, {
formTitle: 'Contact Informatie (Dutch)',
firstName: 'Voornaam1111111111',
lastName: 'Achternaam',
surnamePrefix: 'Tussenvoegsel',
company: 'Bedrijf',
state: 'Provincie',
stateEmptyText: 'Kies een provincie...',
email: 'E-mail',
birth: 'Geb. Datum',
save: 'Opslaan',
cancel: 'Annuleren'
});
}
--------------------------------------end dutch-provinces.js------------------------
ContactForm.js
-------------------------------------start-----------------------
Ext.define('Ext.app.ContactForm', {
extend: 'Ext.form.Panel',
requires: [
'Ext.data.ArrayStore',
'Ext.data.reader.Array',
'Ext.form.field.ComboBox',
'Ext.form.field.Date'
],
formTitle: 'Contact Information (English)',
firstName: 'First Name',
lastName: 'Surname',
surnamePrefix: 'Surname Prefix',
company: 'Company',
state: 'State',
stateEmptyText: 'Choose a state...',
email: 'E-mail',
birth: 'Date of Birth',
save: 'Save',
cancel: 'Cancel',
initComponent : function(config) {
Ext.apply(this, {
url: 'save-form.php',
frame: true,
title: this.formTitle,
bodyStyle: 'padding:5px 5px 0',
width: 370,
defaultType: 'textfield',
defaults: {
width: 330
},
items: [{
fieldLabel: this.firstName,
name: 'firstname',
allowBlank:false
},{
fieldLabel: this.lastName,
name: 'lastName'
},{
fieldLabel: this.surnamePrefix,
width: 150,
name: 'surnamePrefix'
},{
fieldLabel: this.company,
name: 'company'
}, Ext.create('Ext.form.field.ComboBox', {
fieldLabel: this.province,
hiddenName: 'state',
store: Ext.create('Ext.data.ArrayStore', {
fields: ['provincie'],
data : Ext.exampledata.dutch_provinces // from dutch-provinces.js
}),
displayField: 'provincie',
typeAhead: true,
queryMode: 'local',
triggerAction: 'all',
emptyText: this.stateEmptyText,
selectOnFocus:true
}), {
fieldLabel: this.email,
name: 'email',
vtype:'email'
}, Ext.create('Ext.form.field.Date', {
fieldLabel: this.birth,
name: 'birth'
})
],
buttons: [{
text: this.save
},{
text: this.cancel
}]
});
this.callParent(arguments);
}
});
Ext.require([
'Ext.tip.QuickTipManager'
]);
Ext.onReady(function(){
//Ext.tip.QuickTipManager.init();
// turn on validation errors beside the field globally
//Ext.form.field.Base.prototype.msgTarget = 'side';
var bd = Ext.getBody();
bd.createChild({tag: 'h2', html: 'Localized Contact Form'});
// simple form
var simple = Ext.create('Ext.app.ContactForm', {});
simple.render(document.body);
});
----------------------------------------end ContactForm.js----------------
dutch-form.html
---------------------start-------------------------------------------------
<!--<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">-->
<html lang="nl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Dutch Form</title>
<!-- Ext -->
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/ext-debug.js"></script>
<!-- Example -->
<link rel="stylesheet" type="text/css" href="extjs/examples/shared/example.css" />
<script type="text/javascript" src="extjs/examples/shared/examples.js"></script>
<!-- <script type="text/javascript" src="extjs/locale/ext-lang-nl.js"></script> -->
<script type="text/javascript" src="ContactForm-nl.js"></script>
<script type="text/javascript" src="dutch-provinces.js"></script>
<script type="text/javascript" src="ContactForm.js"></script>
</head>
<body>
<h1>Localization with Ext</h1>
<p>The js is not minified so it is readable. See <a href="ContactForm.js">ContactForm.js</a> and <a href="ContactForm-nl.js">ContactForm-nl.js</a>.</p>
</body> </html>
-----------------------------------End dutch-form.html-------------------------------------------
dutch-provinces.js
------------------------------------------------------------------
if (Ext.app.ContactForm) {
Ext.apply(Ext.app.ContactForm.prototype, {
formTitle: 'Contact Informatie (Dutch)',
firstName: 'Voornaam1111111111',
lastName: 'Achternaam',
surnamePrefix: 'Tussenvoegsel',
company: 'Bedrijf',
state: 'Provincie',
stateEmptyText: 'Kies een provincie...',
email: 'E-mail',
birth: 'Geb. Datum',
save: 'Opslaan',
cancel: 'Annuleren'
});
}
--------------------------------------end dutch-provinces.js------------------------
ContactForm.js
-------------------------------------start-----------------------
Ext.define('Ext.app.ContactForm', {
extend: 'Ext.form.Panel',
requires: [
'Ext.data.ArrayStore',
'Ext.data.reader.Array',
'Ext.form.field.ComboBox',
'Ext.form.field.Date'
],
formTitle: 'Contact Information (English)',
firstName: 'First Name',
lastName: 'Surname',
surnamePrefix: 'Surname Prefix',
company: 'Company',
state: 'State',
stateEmptyText: 'Choose a state...',
email: 'E-mail',
birth: 'Date of Birth',
save: 'Save',
cancel: 'Cancel',
initComponent : function(config) {
Ext.apply(this, {
url: 'save-form.php',
frame: true,
title: this.formTitle,
bodyStyle: 'padding:5px 5px 0',
width: 370,
defaultType: 'textfield',
defaults: {
width: 330
},
items: [{
fieldLabel: this.firstName,
name: 'firstname',
allowBlank:false
},{
fieldLabel: this.lastName,
name: 'lastName'
},{
fieldLabel: this.surnamePrefix,
width: 150,
name: 'surnamePrefix'
},{
fieldLabel: this.company,
name: 'company'
}, Ext.create('Ext.form.field.ComboBox', {
fieldLabel: this.province,
hiddenName: 'state',
store: Ext.create('Ext.data.ArrayStore', {
fields: ['provincie'],
data : Ext.exampledata.dutch_provinces // from dutch-provinces.js
}),
displayField: 'provincie',
typeAhead: true,
queryMode: 'local',
triggerAction: 'all',
emptyText: this.stateEmptyText,
selectOnFocus:true
}), {
fieldLabel: this.email,
name: 'email',
vtype:'email'
}, Ext.create('Ext.form.field.Date', {
fieldLabel: this.birth,
name: 'birth'
})
],
buttons: [{
text: this.save
},{
text: this.cancel
}]
});
this.callParent(arguments);
}
});
Ext.require([
'Ext.tip.QuickTipManager'
]);
Ext.onReady(function(){
//Ext.tip.QuickTipManager.init();
// turn on validation errors beside the field globally
//Ext.form.field.Base.prototype.msgTarget = 'side';
var bd = Ext.getBody();
bd.createChild({tag: 'h2', html: 'Localized Contact Form'});
// simple form
var simple = Ext.create('Ext.app.ContactForm', {});
simple.render(document.body);
});
----------------------------------------end ContactForm.js----------------