root / trunk / web / js / main2.js @ 11
History | View | Annotate | Download (2.07 KB)
1 |
window.addEvent('domready', function(){ |
---|---|
2 |
// NOTE: This is an example showing simple state management. During development,
|
3 |
// it is generally best to disable state management as dynamically-generated ids
|
4 |
// can change across page loads, leading to unpredictable results. The developer
|
5 |
// should ensure that stable state ids are set for stateful components in real apps.
|
6 |
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
|
7 |
|
8 |
// create the Data Store
|
9 |
var store = new Ext.data.JsonStore({ |
10 |
proxy: new Ext.data.HttpProxy({ |
11 |
url: 'log.json' |
12 |
}), |
13 |
totalProperty:'total', |
14 |
idProperty: 'id', |
15 |
root: 'rows', |
16 |
fields:[
|
17 |
{name:'date', type:'date', dateFormat:'M d, Y h:i:s A'}, |
18 |
{name:'type'}, |
19 |
{name:'message'} |
20 |
] |
21 |
}); |
22 |
|
23 |
// create the Grid
|
24 |
var grid = new Ext.grid.GridPanel({ |
25 |
title: 'Log', |
26 |
store: store,
|
27 |
loadMask: true, |
28 |
columns: [
|
29 |
{id:'date',header: 'Date', width: 100, renderer: Ext.util.Format.dateRenderer('Y-m-d H:i'), dataIndex: 'date'}, |
30 |
{id:'type',header: 'Type', width: 100, dataIndex: 'type'}, |
31 |
{id:'message',header: 'Message', dataIndex: 'message'} |
32 |
], |
33 |
stripeRows: true, |
34 |
autoExpandColumn: 'message', |
35 |
height: 350, |
36 |
//width: 'auto',
|
37 |
stateful: true, |
38 |
stateId: 'grid', |
39 |
|
40 |
// paging bar on the bottom©
|
41 |
bbar: new Ext.PagingToolbar({ |
42 |
pageSize: 15, |
43 |
store: store,
|
44 |
displayInfo: true, |
45 |
displayMsg: 'Displaying {0} - {1} of {2}', |
46 |
emptyMsg: "No messages to display" |
47 |
}) |
48 |
}); |
49 |
store.load(); |
50 |
|
51 |
var tabs = new Ext.TabPanel({ |
52 |
renderTo: 'tabs1', |
53 |
width:'auto', |
54 |
activeTab: 0, |
55 |
frame:true, |
56 |
defaults:{autoHeight: true}, |
57 |
boxMaxHeight: 400, |
58 |
items:[
|
59 |
{autoLoad:{url: 'info.jsp', scripts:true }, title: 'Info'}, |
60 |
{autoLoad:{url: 'status.jsp', scripts:true }, title: 'Status'}, |
61 |
grid |
62 |
] |
63 |
}); |
64 |
}); |