git.roojs.org Git - roojs1/blob - docs/src/Roo_grid_PropertyGrid.js.html

   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">/*
   2  * Based on:
   3  * Ext JS Library 1.1.1
   4  * Copyright(c) 2006-2007, Ext JS, LLC.
   5  *
   6  * Originally Released Under LGPL - original licence link has changed is not relivant.
   7  *
   8  * Fork - LGPL
   9  * &lt;script type=&quot;text/javascript&quot;&gt;
  10  */
  11
  12
  13
  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">]);
  17
  18
  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">);
  27     }
  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">);
  29 };
  30
  31
  32
  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">));
  41             }
  42         }
  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">);
  44     },
  45
  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">();
  56             }
  57         }
  58     },
  59
  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">);
  62     },
  63
  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">&amp;&amp; </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">;
  69         }
  70         </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
  71     },
  72
  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">);
  76     },
  77
  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">;
  80     }
  81 });
  82
  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">}
  89     ]);
  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">}
  95         ]
  96     });
  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">}))
 105     };
 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">);
 108 };
 109
 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">, {
 111
 112
 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">,
 115
 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">,
 117
 118
 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">);
 121     },
 122
 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">;
 125     },
 126
 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;
 129     },
 130
 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">;
 134     },
 135
 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">);
 138     },
 139
 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">);
 146         }
 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">);
 148     },
 149
 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">&amp;&amp; </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">;
 153     },
 154
 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">];
 158
 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">]];
 161         }
 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">];
 164         }
 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">];
 173         }
 174     }
 175 });
 176
 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  * &lt;br&gt;&lt;br&gt;Usage:&lt;pre&gt;&lt;code&gt;
 182  var grid = new Roo.grid.PropertyGrid(&quot;my-container-id&quot;, {
 183
 184  });
 185  // set any options
 186  grid.render();
 187  * &lt;/code&gt;&lt;/pre&gt;
 188
 189  * @constructor
 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.
 194  */
 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
 221              */
 222         </span><span class="jsdoc-string">&quot;beforepropertychange&quot;</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
 230              */
 231         </span><span class="jsdoc-string">&quot;propertychange&quot;</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">|| {};
 234 };
 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">, {
 236
 237      </span><span class="jsdoc-comment">/**
 238      * @cfg {Object} customEditors map of colnames=&gt; 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.
 242          */
 243
 244       /**
 245      * @cfg {Object} propertyNames map of property Names to their displayed value
 246          */
 247
 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">);
 251     },
 252
 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">();
 257         }
 258     },
 259
 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">();
 263     },
 264     </span><span class="jsdoc-comment">/**
 265      * Sets the data for the Grid
 266      * accepts a Key =&gt; Value object of all the elements avaiable.
 267      * @param {Object} data  to appear in grid.
 268      */
 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
 276      */
 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">();
 279     }
 280 });</span></code></body></html>