root / trunk / web / js / main2.js @ 13
History | View | Annotate | Download (2.07 KB)
1 | 9 | andrej.cim | 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 | }); |