1 <html><head><title>Roo/grid/PropertyGrid.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
4 * Copyright(c) 2006-2007, Ext JS, LLC.
6 * Originally Released Under LGPL - original licence link has changed is not relivant.
9 * <script type="text/javascript">
14 </span><span class="jsdoc-var">Roo.grid.PropertyRecord </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.data.Record.create</span><span class="jsdoc-syntax">([
15 {</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'name'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">}, </span><span class="jsdoc-string">'value'
16 </span><span class="jsdoc-syntax">]);
19 </span><span class="jsdoc-var">Roo.grid.PropertyStore </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">grid</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">source</span><span class="jsdoc-syntax">){
20 </span><span class="jsdoc-var">this.grid </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">grid</span><span class="jsdoc-syntax">;
21 </span><span class="jsdoc-var">this.store </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.data.Store</span><span class="jsdoc-syntax">({
22 </span><span class="jsdoc-var">recordType </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.grid.PropertyRecord
23 </span><span class="jsdoc-syntax">});
24 </span><span class="jsdoc-var">this.store.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'update'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onUpdate</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
25 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">source</span><span class="jsdoc-syntax">){
26 </span><span class="jsdoc-var">this.setSource</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">source</span><span class="jsdoc-syntax">);
28 </span><span class="jsdoc-var">Roo.grid.PropertyStore.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
33 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.grid.PropertyStore</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.util.Observable</span><span class="jsdoc-syntax">, {
34 </span><span class="jsdoc-var">setSource </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">){
35 </span><span class="jsdoc-var">this.source </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">;
36 </span><span class="jsdoc-var">this.store.removeAll</span><span class="jsdoc-syntax">();
37 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">= [];
38 </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">k </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">){
39 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isEditableValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">])){
40 </span><span class="jsdoc-var">data.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.grid.PropertyRecord</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">]}, </span><span class="jsdoc-var">k</span><span class="jsdoc-syntax">));
43 </span><span class="jsdoc-var">this.store.loadRecords</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">records</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">}, {}, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
46 </span><span class="jsdoc-var">onUpdate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ds</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">record</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">){
47 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">Roo.data.Record.EDIT</span><span class="jsdoc-syntax">){
48 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">record.data</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'value'</span><span class="jsdoc-syntax">];
49 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">oldValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">record.modified</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'value'</span><span class="jsdoc-syntax">];
50 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.grid.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'beforepropertychange'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.source</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">record.id</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">oldValue</span><span class="jsdoc-syntax">) !== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
51 </span><span class="jsdoc-var">this.source</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">record.id</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
52 </span><span class="jsdoc-var">record.commit</span><span class="jsdoc-syntax">();
53 </span><span class="jsdoc-var">this.grid.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'propertychange'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.source</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">record.id</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">oldValue</span><span class="jsdoc-syntax">);
54 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
55 </span><span class="jsdoc-var">record.reject</span><span class="jsdoc-syntax">();
60 </span><span class="jsdoc-var">getProperty </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">){
61 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.store.getAt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">);
64 </span><span class="jsdoc-var">isEditableValue</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">){
65 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">val </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Date</span><span class="jsdoc-syntax">){
66 </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
67 }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'object' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'function'</span><span class="jsdoc-syntax">){
68 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
70 </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
73 </span><span class="jsdoc-var">setValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">){
74 </span><span class="jsdoc-var">this.source</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">;
75 </span><span class="jsdoc-var">this.store.getById</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.set</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'value'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">);
78 </span><span class="jsdoc-var">getSource </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
79 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.source</span><span class="jsdoc-syntax">;
83 </span><span class="jsdoc-var">Roo.grid.PropertyColumnModel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">grid</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">store</span><span class="jsdoc-syntax">){
84 </span><span class="jsdoc-var">this.grid </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">grid</span><span class="jsdoc-syntax">;
85 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">g </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.grid</span><span class="jsdoc-syntax">;
86 </span><span class="jsdoc-var">g.PropertyColumnModel.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, [
87 {</span><span class="jsdoc-var">header</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.nameText</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sortable</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataIndex</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'name'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'name'</span><span class="jsdoc-syntax">},
88 {</span><span class="jsdoc-var">header</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.valueText</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">resizable</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dataIndex</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'value'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'value'</span><span class="jsdoc-syntax">}
90 </span><span class="jsdoc-var">this.store </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">store</span><span class="jsdoc-syntax">;
91 </span><span class="jsdoc-var">this.bselect </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">, {
92 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'select'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'display:none'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'x-grid-editor'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">children</span><span class="jsdoc-syntax">: [
93 {</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'option'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'true'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'true'</span><span class="jsdoc-syntax">},
94 {</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'option'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'false'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'false'</span><span class="jsdoc-syntax">}
97 </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.bselect</span><span class="jsdoc-syntax">);
98 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">f </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.form</span><span class="jsdoc-syntax">;
99 </span><span class="jsdoc-var">this.editors </span><span class="jsdoc-syntax">= {
100 </span><span class="jsdoc-string">'date' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">g.GridEditor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">f.DateField</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">selectOnFocus</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">})),
101 </span><span class="jsdoc-string">'string' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">g.GridEditor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">f.TextField</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">selectOnFocus</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">})),
102 </span><span class="jsdoc-string">'number' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">g.GridEditor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">f.NumberField</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">selectOnFocus</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'text-align:left;'</span><span class="jsdoc-syntax">})),
103 </span><span class="jsdoc-string">'int' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">g.GridEditor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">f.NumberField</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">selectOnFocus</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">allowDecimals</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'text-align:left;'</span><span class="jsdoc-syntax">})),
104 </span><span class="jsdoc-string">'boolean' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">g.GridEditor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">f.Field</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">:</span><span class="jsdoc-var">this.bselect</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">selectOnFocus</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">}))
106 </span><span class="jsdoc-var">this.renderCellDelegate </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.renderCell.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
107 </span><span class="jsdoc-var">this.renderPropDelegate </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.renderProp.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
110 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.grid.PropertyColumnModel</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.grid.ColumnModel</span><span class="jsdoc-syntax">, {
113 </span><span class="jsdoc-var">nameText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Name'</span><span class="jsdoc-syntax">,
114 </span><span class="jsdoc-var">valueText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Value'</span><span class="jsdoc-syntax">,
116 </span><span class="jsdoc-var">dateFormat </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'m/j/Y'</span><span class="jsdoc-syntax">,
119 </span><span class="jsdoc-var">renderDate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dateVal</span><span class="jsdoc-syntax">){
120 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">dateVal.dateFormat</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dateFormat</span><span class="jsdoc-syntax">);
123 </span><span class="jsdoc-var">renderBool </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bVal</span><span class="jsdoc-syntax">){
124 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">bVal </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'true' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'false'</span><span class="jsdoc-syntax">;
127 </span><span class="jsdoc-var">isCellEditable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">colIndex</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rowIndex</span><span class="jsdoc-syntax">){
128 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">colIndex </span><span class="jsdoc-syntax">== 1;
131 </span><span class="jsdoc-var">getRenderer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">){
132 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">col </span><span class="jsdoc-syntax">== 1 ?
133 </span><span class="jsdoc-var">this.renderCellDelegate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.renderPropDelegate</span><span class="jsdoc-syntax">;
136 </span><span class="jsdoc-var">renderProp </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">){
137 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getPropertyName</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">);
140 </span><span class="jsdoc-var">renderCell </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">){
141 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">;
142 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Date</span><span class="jsdoc-syntax">){
143 </span><span class="jsdoc-var">rv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.renderDate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">);
144 }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'boolean'</span><span class="jsdoc-syntax">){
145 </span><span class="jsdoc-var">rv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.renderBool</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">);
147 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.util.Format.htmlEncode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rv</span><span class="jsdoc-syntax">);
150 </span><span class="jsdoc-var">getPropertyName </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">){
151 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.grid.propertyNames</span><span class="jsdoc-syntax">;
152 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">pn </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">pn</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">] ? </span><span class="jsdoc-var">pn</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">] : </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">;
155 </span><span class="jsdoc-var">getCellEditor </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">colIndex</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rowIndex</span><span class="jsdoc-syntax">){
156 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.store.getProperty</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rowIndex</span><span class="jsdoc-syntax">);
157 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p.data</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'name'</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p.data</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'value'</span><span class="jsdoc-syntax">];
159 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.grid.customEditors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">]) == </span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">){
160 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.editors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.grid.customEditors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">]];
162 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.grid.customEditors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">]) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">){
163 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.grid.customEditors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">];
165 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Date</span><span class="jsdoc-syntax">){
166 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.editors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'date'</span><span class="jsdoc-syntax">];
167 }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'number'</span><span class="jsdoc-syntax">){
168 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.editors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'number'</span><span class="jsdoc-syntax">];
169 }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'boolean'</span><span class="jsdoc-syntax">){
170 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.editors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'boolean'</span><span class="jsdoc-syntax">];
171 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
172 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.editors</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">];
177 </span><span class="jsdoc-comment">/**
178 * @class Roo.grid.PropertyGrid
179 * @extends Roo.grid.EditorGrid
180 * This class represents the interface of a component based property grid control.
181 * <br><br>Usage:<pre><code>
182 var grid = new Roo.grid.PropertyGrid("my-container-id", {
187 * </code></pre>
190 * @param {String/HTMLElement/Roo.Element} container The element into which this grid will be rendered -
191 * The container MUST have some type of size defined for the grid to fill. The container will be
192 * automatically set to position relative if it isn't already.
193 * @param {Object} config A config object that sets properties on this grid.
195 </span><span class="jsdoc-var">Roo.grid.PropertyGrid </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">container</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
196 </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">|| {};
197 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">store </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.grid.PropertyStore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
198 </span><span class="jsdoc-var">this.store </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">store</span><span class="jsdoc-syntax">;
199 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cm </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.grid.PropertyColumnModel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">store</span><span class="jsdoc-syntax">);
200 </span><span class="jsdoc-var">store.store.sort</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'name'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'ASC'</span><span class="jsdoc-syntax">);
201 </span><span class="jsdoc-var">Roo.grid.PropertyGrid.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">container</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">({
202 </span><span class="jsdoc-var">ds</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">store.store</span><span class="jsdoc-syntax">,
203 </span><span class="jsdoc-var">cm</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">cm</span><span class="jsdoc-syntax">,
204 </span><span class="jsdoc-var">enableColLock</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
205 </span><span class="jsdoc-var">enableColumnMove</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
206 </span><span class="jsdoc-var">stripeRows</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
207 </span><span class="jsdoc-var">trackMouseOver</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
208 </span><span class="jsdoc-var">clicksToEdit</span><span class="jsdoc-syntax">:1
209 }, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">));
210 </span><span class="jsdoc-var">this.getGridEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'x-props-grid'</span><span class="jsdoc-syntax">);
211 </span><span class="jsdoc-var">this.lastEditRow </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
212 </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'columnresize'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onColumnResize</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
213 </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
214 </span><span class="jsdoc-comment">/**
215 * @event beforepropertychange
216 * Fires before a property changes (return false to stop?)
217 * @param {Roo.grid.PropertyGrid} grid property grid? (check could be store)
218 * @param {String} id Record Id
219 * @param {String} newval New Value
220 * @param {String} oldval Old Value
222 </span><span class="jsdoc-string">"beforepropertychange"</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
223 </span><span class="jsdoc-comment">/**
224 * @event propertychange
225 * Fires after a property changes
226 * @param {Roo.grid.PropertyGrid} grid property grid? (check could be store)
227 * @param {String} id Record Id
228 * @param {String} newval New Value
229 * @param {String} oldval Old Value
231 </span><span class="jsdoc-string">"propertychange"</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
232 </span><span class="jsdoc-syntax">});
233 </span><span class="jsdoc-var">this.customEditors </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.customEditors </span><span class="jsdoc-syntax">|| {};
235 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.grid.PropertyGrid</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.grid.EditorGrid</span><span class="jsdoc-syntax">, {
237 </span><span class="jsdoc-comment">/**
238 * @cfg {Object} customEditors map of colnames=> custom editors.
239 * the custom editor can be one of the standard ones (date|string|number|int|boolean), or a
240 * grid editor eg. Roo.grid.GridEditor(new Roo.form.TextArea({selectOnFocus:true})),
241 * false disables editing of the field.
245 * @cfg {Object} propertyNames map of property Names to their displayed value
248 </span><span class="jsdoc-var">render </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
249 </span><span class="jsdoc-var">Roo.grid.PropertyGrid.superclass.render.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
250 </span><span class="jsdoc-var">this.autoSize.defer</span><span class="jsdoc-syntax">(100, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
253 </span><span class="jsdoc-var">autoSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
254 </span><span class="jsdoc-var">Roo.grid.PropertyGrid.superclass.autoSize.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
255 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.view</span><span class="jsdoc-syntax">){
256 </span><span class="jsdoc-var">this.view.fitColumns</span><span class="jsdoc-syntax">();
260 </span><span class="jsdoc-var">onColumnResize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
261 </span><span class="jsdoc-var">this.colModel.setColumnWidth</span><span class="jsdoc-syntax">(1, </span><span class="jsdoc-var">this.container.getWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)-</span><span class="jsdoc-var">this.colModel.getColumnWidth</span><span class="jsdoc-syntax">(0));
262 </span><span class="jsdoc-var">this.autoSize</span><span class="jsdoc-syntax">();
264 </span><span class="jsdoc-comment">/**
265 * Sets the data for the Grid
266 * accepts a Key => Value object of all the elements avaiable.
267 * @param {Object} data to appear in grid.
269 </span><span class="jsdoc-var">setSource </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">source</span><span class="jsdoc-syntax">){
270 </span><span class="jsdoc-var">this.store.setSource</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">source</span><span class="jsdoc-syntax">);
271 </span><span class="jsdoc-comment">//this.autoSize();
272 </span><span class="jsdoc-syntax">},
273 </span><span class="jsdoc-comment">/**
274 * Gets all the data from the grid.
275 * @return {Object} data data stored in grid
277 </span><span class="jsdoc-var">getSource </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
278 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.store.getSource</span><span class="jsdoc-syntax">();
280 });</span></code></body></html>