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
| Ext.define('Neptune.view.grid.Grids', {
| extend: 'Ext.container.Container',
| xtype: 'grids',
| id: 'grids',
|
| layout: {
| type: 'table',
| columns: 2,
| tdAttrs: { style: 'padding: 7px; vertical-align: top;' },
| tableAttrs: {
| style: 'width:100%'
| }
| },
| defaults: {
| height: 300
| },
| items: [
| {
| xtype: 'basicGrid',
| title: "Grid with Cell Editing and D'n'D reordering",
| viewConfig: {
| plugins: {
| ptype: 'gridviewdragdrop',
| dragGroup: 'firstGridDDGroup',
| dropGroup: 'firstGridDDGroup'
| },
| listeners: {
| drop: function(node, data, dropRec, dropPosition) {
| var dropOn = dropRec ? ' ' + dropPosition + ' ' + dropRec.get('company') : ' on empty view';
| Ext.Msg.alert("Drag from right to left", 'Dropped ' + data.records[0].get('company') + dropOn);
| }
| }
| }
| },
| {
| xtype: 'basicGrid',
| plugins: {
| ptype: 'rowediting'
| },
| rowLines: false,
| title: 'Grid with Row Editing, and no Row Lines'
| },
| {
| xtype: 'basicGrid',
| selModel: Ext.create('Ext.selection.CheckboxModel'),
| plugins: null,
| dockedItems: [{
| xtype: 'pagingtoolbar',
| store: 'Company',
| dock: 'bottom',
| displayInfo: true
| }],
| title: 'Grid with Checkbox Selection Model and Paging Toolbar'
| },
| {
| xtype: 'groupHeaderGrid'
| },
| {
| xtype: 'groupGrid'
| },
| {
| xtype: 'lockGroupSummary'
| },
| {
| xtype: 'basicGrid',
| plugins: [{
| ptype: 'rowexpander',
| rowBodyTpl : new Ext.XTemplate(
| '<p><b>Company:</b> {company}</p>',
| '<p><b>Change:</b> {change:this.formatChange}</p><br>',
| '<p><b>Summary:</b> {desc}</p>',
| {
| formatChange: function(v){
| var color = v >= 0 ? 'green' : 'red';
| return '<span style="color: ' + color + ';">' + Ext.util.Format.usMoney(v) + '</span>';
| }
| })
| }],
| title: 'Grid with RowExpander'
| }
| ]
| });
|
|
