- Replaced color picker form control with a more robust version.
This commit is contained in:
JT Smith
parent
6fe068e42d
commit
6e0470771e
1193 changed files with 342 additions and 223 deletions
201
www/extras/extjs/docs/output/PropertyGrid.jss.html
vendored
Normal file
201
www/extras/extjs/docs/output/PropertyGrid.jss.html
vendored
Normal file
|
|
@ -0,0 +1,201 @@
|
|||
<html><head><title>PropertyGrid.js</title><link rel="stylesheet" type="text/css" href="../resources/style.css" media="screen"/></head><body><h1>PropertyGrid.js</h1><pre class="highlighted"><code>Ext.grid.PropertyRecord = Ext.data.Record.create([
|
||||
{name:'name',type:'string'}, 'value'
|
||||
]);
|
||||
|
||||
Ext.grid.PropertyStore = <b>function</b>(grid, source){
|
||||
<b>this</b>.grid = grid;
|
||||
<b>this</b>.store = <b>new</b> Ext.data.Store({
|
||||
recordType : Ext.grid.PropertyRecord
|
||||
});
|
||||
<b>this</b>.store.on('update', <b>this</b>.onUpdate, <b>this</b>);
|
||||
<b>if</b>(source){
|
||||
<b>this</b>.setSource(source);
|
||||
}
|
||||
Ext.grid.PropertyStore.superclass.constructor.call(<b>this</b>);
|
||||
};
|
||||
Ext.extend(Ext.grid.PropertyStore, Ext.util.Observable, {
|
||||
setSource : <b>function</b>(o){
|
||||
<b>this</b>.source = o;
|
||||
<b>this</b>.store.removeAll();
|
||||
<b>var</b> data = [];
|
||||
<b>for</b>(var k <b>in</b> o){
|
||||
<b>if</b>(this.isEditableValue(o[k])){
|
||||
data.push(<b>new</b> Ext.grid.PropertyRecord({name: k, value: o[k]}, k));
|
||||
}
|
||||
}
|
||||
<b>this</b>.store.loadRecords({records: data}, {}, true);
|
||||
},
|
||||
|
||||
onUpdate : <b>function</b>(ds, record, type){
|
||||
<b>if</b>(type == Ext.data.Record.EDIT){
|
||||
<b>var</b> v = record.data['value'];
|
||||
<b>var</b> oldValue = record.modified['value'];
|
||||
<b>if</b>(this.grid.fireEvent('beforepropertychange', <b>this</b>.source, record.id, v, oldValue) !== false){
|
||||
<b>this</b>.source[record.id] = v;
|
||||
record.commit();
|
||||
<b>this</b>.grid.fireEvent('propertychange', <b>this</b>.source, record.id, v, oldValue);
|
||||
}<b>else</b>{
|
||||
record.reject();
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
getProperty : <b>function</b>(row){
|
||||
<b>return</b> this.store.getAt(row);
|
||||
},
|
||||
|
||||
isEditableValue: <b>function</b>(val){
|
||||
<b>if</b>(val && val instanceof Date){
|
||||
<b>return</b> true;
|
||||
}<b>else</b> if(<b>typeof</b> val == 'object' || <b>typeof</b> val == '<b>function</b>'){
|
||||
<b>return</b> false;
|
||||
}
|
||||
<b>return</b> true;
|
||||
},
|
||||
|
||||
setValue : <b>function</b>(prop, value){
|
||||
<b>this</b>.source[prop] = value;
|
||||
<b>this</b>.store.getById(prop).set('value', value);
|
||||
},
|
||||
|
||||
getSource : <b>function</b>(){
|
||||
<b>return</b> this.source;
|
||||
}
|
||||
});
|
||||
|
||||
Ext.grid.PropertyColumnModel = <b>function</b>(grid, store){
|
||||
<b>this</b>.grid = grid;
|
||||
<b>var</b> g = Ext.grid;
|
||||
g.PropertyColumnModel.superclass.constructor.call(<b>this</b>, [
|
||||
{header: <b>this</b>.nameText, sortable: true, dataIndex:'name', id: 'name'},
|
||||
{header: <b>this</b>.valueText, resizable:false, dataIndex: 'value', id: 'value'}
|
||||
]);
|
||||
<b>this</b>.store = store;
|
||||
<b>this</b>.bselect = Ext.DomHelper.append(document.body, {
|
||||
tag: 'select', style:'display:none', cls: 'x-grid-editor', children: [
|
||||
{tag: 'option', value: 'true', html: 'true'},
|
||||
{tag: 'option', value: 'false', html: 'false'}
|
||||
]
|
||||
});
|
||||
Ext.id(<b>this</b>.bselect);
|
||||
<b>var</b> f = Ext.form;
|
||||
<b>this</b>.editors = {
|
||||
'date' : <b>new</b> g.GridEditor(<b>new</b> f.DateField({selectOnFocus:true})),
|
||||
'string' : <b>new</b> g.GridEditor(<b>new</b> f.TextField({selectOnFocus:true})),
|
||||
'number' : <b>new</b> g.GridEditor(<b>new</b> f.NumberField({selectOnFocus:true, style:'text-align:left;'})),
|
||||
'boolean' : <b>new</b> g.GridEditor(<b>new</b> f.Field({el:<b>this</b>.beselect,selectOnFocus:true}))
|
||||
};
|
||||
<b>this</b>.renderCellDelegate = <b>this</b>.renderCell.createDelegate(<b>this</b>);
|
||||
<b>this</b>.renderPropDelegate = <b>this</b>.renderProp.createDelegate(<b>this</b>);
|
||||
};
|
||||
|
||||
Ext.extend(Ext.grid.PropertyColumnModel, Ext.grid.ColumnModel, {
|
||||
nameText : 'Name',
|
||||
valueText : 'Value',
|
||||
dateFormat : 'm/j/Y',
|
||||
renderDate : <b>function</b>(dateVal){
|
||||
<b>return</b> dateVal.dateFormat(<b>this</b>.dateFormat);
|
||||
},
|
||||
|
||||
renderBool : <b>function</b>(bVal){
|
||||
<b>return</b> bVal ? 'true' : 'false';
|
||||
},
|
||||
|
||||
isCellEditable : <b>function</b>(colIndex, rowIndex){
|
||||
<b>return</b> colIndex == 1;
|
||||
},
|
||||
|
||||
getRenderer : <b>function</b>(col){
|
||||
<b>return</b> col == 1 ?
|
||||
<b>this</b>.renderCellDelegate : <b>this</b>.renderPropDelegate;
|
||||
},
|
||||
|
||||
renderProp : <b>function</b>(v){
|
||||
<b>return</b> this.getPropertyName(v);
|
||||
},
|
||||
|
||||
renderCell : <b>function</b>(val){
|
||||
<b>var</b> rv = val;
|
||||
<b>if</b>(val instanceof Date){
|
||||
rv = <b>this</b>.renderDate(val);
|
||||
}<b>else</b> if(<b>typeof</b> val == 'boolean'){
|
||||
rv = <b>this</b>.renderBool(val);
|
||||
}
|
||||
<b>return</b> Ext.util.Format.htmlEncode(rv);
|
||||
},
|
||||
|
||||
getPropertyName : <b>function</b>(name){
|
||||
<b>var</b> pn = <b>this</b>.grid.propertyNames;
|
||||
<b>return</b> pn && pn[name] ? pn[name] : name;
|
||||
},
|
||||
|
||||
getCellEditor : <b>function</b>(colIndex, rowIndex){
|
||||
<b>var</b> p = <b>this</b>.store.getProperty(rowIndex);
|
||||
<b>var</b> n = p.data['name'], val = p.data['value'];
|
||||
<b>if</b>(this.grid.customEditors[n]){
|
||||
<b>return</b> this.grid.customEditors[n];
|
||||
}
|
||||
<b>if</b>(val instanceof Date){
|
||||
<b>return</b> this.editors['date'];
|
||||
}<b>else</b> if(<b>typeof</b> val == 'number'){
|
||||
<b>return</b> this.editors['number'];
|
||||
}<b>else</b> if(<b>typeof</b> val == 'boolean'){
|
||||
<b>return</b> this.editors['boolean'];
|
||||
}<b>else</b>{
|
||||
<b>return</b> this.editors['string'];
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Ext.grid.PropertyGrid = <b>function</b>(container, config){
|
||||
config = config || {};
|
||||
<b>var</b> store = <b>new</b> Ext.grid.PropertyStore(<b>this</b>);
|
||||
<b>this</b>.store = store;
|
||||
<b>var</b> cm = <b>new</b> Ext.grid.PropertyColumnModel(<b>this</b>, store);
|
||||
store.store.sort('name', 'ASC');
|
||||
Ext.grid.PropertyGrid.superclass.constructor.call(<b>this</b>, container, Ext.apply({
|
||||
ds: store.store,
|
||||
cm: cm,
|
||||
enableColLock:false,
|
||||
enableColumnMove:false,
|
||||
stripeRows:false,
|
||||
trackMouseOver: false,
|
||||
clicksToEdit:1
|
||||
}, config));
|
||||
<b>this</b>.container.addClass('x-props-grid');
|
||||
<b>this</b>.lastEditRow = null;
|
||||
<b>this</b>.on('columnresize', <b>this</b>.onColumnResize, <b>this</b>);
|
||||
<b>this</b>.addEvents({
|
||||
beforepropertychange: true,
|
||||
propertychange: true
|
||||
});
|
||||
<b>this</b>.customEditors = <b>this</b>.customEditors || {};
|
||||
};
|
||||
Ext.extend(Ext.grid.PropertyGrid, Ext.grid.EditorGrid, {
|
||||
render : <b>function</b>(){
|
||||
Ext.grid.PropertyGrid.superclass.render.call(<b>this</b>);
|
||||
<b>this</b>.autoSize.defer(100, <b>this</b>);
|
||||
},
|
||||
|
||||
autoSize : <b>function</b>(){
|
||||
Ext.grid.PropertyGrid.superclass.autoSize.call(<b>this</b>);
|
||||
<b>if</b>(this.view){
|
||||
<b>this</b>.view.fitColumns();
|
||||
}
|
||||
},
|
||||
|
||||
onColumnResize : <b>function</b>(){
|
||||
<b>this</b>.colModel.setColumnWidth(1, <b>this</b>.container.getWidth(true)-<b>this</b>.colModel.getColumnWidth(0));
|
||||
<b>this</b>.autoSize();
|
||||
},
|
||||
|
||||
setSource : <b>function</b>(source){
|
||||
<b>this</b>.store.setSource(source);
|
||||
<i>//<b>this</b>.autoSize();</i>
|
||||
},
|
||||
|
||||
getSource : <b>function</b>(){
|
||||
<b>return</b> this.store.getSource();
|
||||
}
|
||||
});</code></pre><hr><div style="font-size:10px;text-align:center;color:gray;">Ext - Copyright © 2006-2007 Ext JS, LLC<br />All rights reserved.</div>
|
||||
</body></html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue