multi-lang_wev8.js
3.24 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
/*
* Ext JS Library 2.0.2
* Copyright(c) 2006-2008, Ext JS, LLC.
* licensing@extjs.com
*
* http://extjs.com/license
*/
Ext.onReady(function(){
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'side';
/* Language chooser combobox */
var store = new Ext.data.SimpleStore({
fields: ['code', 'language', 'charset'],
data : Ext.exampledata.languages // from languages.js
});
var combo = new Ext.form.ComboBox({
store: store,
displayField:'language',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
emptyText:'Select a language...',
selectOnFocus:true,
onSelect: function(record) {
window.location.search = Ext.urlEncode({"lang":record.get("code"),"charset":record.get("charset")});
}
});
combo.render('languages');
// get the selected language code parameter from url (if exists)
var params = Ext.urlDecode(window.location.search.substring(1));
if (params.lang) {
// check if there's really a language with that language code
record = store.data.find(function(item, key) {
if (item.data.code==params.lang){
return true;
}
return false;
});
// if language was found in store assign it as current value in combobox
if (record) {
combo.setValue(record.data.language);
}
}
/* Email field */
var emailfield = new Ext.FormPanel({
labelWidth: 100, // label settings here cascade unless overridden
frame:true,
title: 'Email Field',
bodyStyle:'padding:5px 5px 0',
width: 360,
defaults: {width: 220},
defaultType: 'textfield',
items: [{
fieldLabel: 'Email',
name: 'email',
vtype:'email'
}
]
});
emailfield.render('emailfield');
/* Datepicker */
var datefield = new Ext.FormPanel({
labelWidth: 100, // label settings here cascade unless overridden
frame:true,
title: 'Datepicker',
bodyStyle:'padding:5px 5px 0',
width: 360,
defaults: {width: 220},
defaultType: 'datefield',
items: [{
fieldLabel: 'Date',
name: 'date'
}
]
});
datefield.render('datefield');
// shorthand alias
var fm = Ext.form, Ed = Ext.grid.GridEditor;
var monthArray = Date.monthNames.map(function (e) { return [e]; });
var ds = new Ext.data.Store({
proxy: new Ext.data.PagingMemoryProxy(monthArray),
reader: new Ext.data.ArrayReader({}, [
{name: 'month'}
])
});
var cm = new Ext.grid.ColumnModel([{
header: "Months of the year",
dataIndex: 'month',
editor: new Ed(new fm.TextField({
allowBlank: false
})),
width: 240
}]);
cm.defaultSortable = true;
var grid = new Ext.grid.GridPanel({
el:'grid',
width: 360,
height: 203,
title:'Month Browser',
store: ds,
cm: cm,
sm: new Ext.grid.RowSelectionModel({selectRow:Ext.emptyFn}),
bbar: new Ext.PagingToolbar({
pageSize: 6,
store: ds,
displayInfo: true
})
})
grid.render();
// trigger the data store load
ds.load({params:{start:0, limit:6}});
});