1 | /*! |
---|
2 | * Ext JS Library 3.0.0 |
---|
3 | * Copyright(c) 2006-2009 Ext JS, LLC |
---|
4 | * licensing@extjs.com |
---|
5 | * http://www.extjs.com/license |
---|
6 | */ |
---|
7 | Ext.ns('Ext.ux.grid'); |
---|
8 | |
---|
9 | /** |
---|
10 | * @class Ext.ux.grid.TableGrid |
---|
11 | * @extends Ext.grid.GridPanel |
---|
12 | * A Grid which creates itself from an existing HTML table element. |
---|
13 | * @history |
---|
14 | * 2007-03-01 Original version by Nige "Animal" White |
---|
15 | * 2007-03-10 jvs Slightly refactored to reuse existing classes * @constructor |
---|
16 | * @param {String/HTMLElement/Ext.Element} table The table element from which this grid will be created - |
---|
17 | * The table MUST have some type of size defined for the grid to fill. The container will be |
---|
18 | * automatically set to position relative if it isn't already. |
---|
19 | * @param {Object} config A config object that sets properties on this grid and has two additional (optional) |
---|
20 | * properties: fields and columns which allow for customizing data fields and columns for this grid. |
---|
21 | */ |
---|
22 | Ext.ux.grid.TableGrid = function(table, config){ |
---|
23 | config = config || |
---|
24 | {}; |
---|
25 | Ext.apply(this, config); |
---|
26 | var cf = config.fields || [], ch = config.columns || []; |
---|
27 | table = Ext.get(table); |
---|
28 | |
---|
29 | var ct = table.insertSibling(); |
---|
30 | |
---|
31 | var fields = [], cols = []; |
---|
32 | var headers = table.query("thead th"); |
---|
33 | for (var i = 0, h; h = headers[i]; i++) { |
---|
34 | var text = h.innerHTML; |
---|
35 | var name = 'tcol-' + i; |
---|
36 | |
---|
37 | fields.push(Ext.applyIf(cf[i] || |
---|
38 | {}, { |
---|
39 | name: name, |
---|
40 | mapping: 'td:nth(' + (i + 1) + ')/@innerHTML' |
---|
41 | })); |
---|
42 | |
---|
43 | cols.push(Ext.applyIf(ch[i] || |
---|
44 | {}, { |
---|
45 | 'header': text, |
---|
46 | 'dataIndex': name, |
---|
47 | 'width': h.offsetWidth, |
---|
48 | 'tooltip': h.title, |
---|
49 | 'sortable': true |
---|
50 | })); |
---|
51 | } |
---|
52 | |
---|
53 | var ds = new Ext.data.Store({ |
---|
54 | reader: new Ext.data.XmlReader({ |
---|
55 | record: 'tbody tr' |
---|
56 | }, fields) |
---|
57 | }); |
---|
58 | |
---|
59 | ds.loadData(table.dom); |
---|
60 | |
---|
61 | var cm = new Ext.grid.ColumnModel(cols); |
---|
62 | |
---|
63 | if (config.width || config.height) { |
---|
64 | ct.setSize(config.width || 'auto', config.height || 'auto'); |
---|
65 | } |
---|
66 | else { |
---|
67 | ct.setWidth(table.getWidth()); |
---|
68 | } |
---|
69 | |
---|
70 | if (config.remove !== false) { |
---|
71 | table.remove(); |
---|
72 | } |
---|
73 | |
---|
74 | Ext.applyIf(this, { |
---|
75 | 'ds': ds, |
---|
76 | 'cm': cm, |
---|
77 | 'sm': new Ext.grid.RowSelectionModel(), |
---|
78 | autoHeight: true, |
---|
79 | autoWidth: false |
---|
80 | }); |
---|
81 | Ext.ux.grid.TableGrid.superclass.constructor.call(this, ct, {}); |
---|
82 | }; |
---|
83 | |
---|
84 | Ext.extend(Ext.ux.grid.TableGrid, Ext.grid.GridPanel); |
---|
85 | |
---|
86 | //backwards compat |
---|
87 | Ext.grid.TableGrid = Ext.ux.grid.TableGrid; |
---|