Code:
Application.PartsInfo = Ext.extend(Ext.grid.EditorGridPanel, {
stateful: false,
objName: 'partnum',
idName:'infID',
initComponent:function(){
this.recordForm = new Ext.ux.grid.RecordForm({
title : 'Row Record Editor',
iconCls : 'icon-edit-record',
columnCount : 2,
ignoreFields : {
infID : true
},
readonlyFields : {
action1 : true
},
disabledFields : {
qtip1 : true
},
formConfig : {
labelWidth : 80,
buttonAlign : 'right',
bodyStyle : 'padding-top:10px'
}
});
this.checkColumn = new Ext.grid.CheckColumn({
header:'HAZMAT?',
dataIndex:'hazmat',
width:70
});
//create row actions
this.rowActions = new Ext.ux.grid.RowActions({
actions:[{
iconCls:'icon-minus'
,qtip:'Delete Record'
},{
iconCls:'icon-edit-record'
,qtip:'Edit Record'
}]
,widthIntercept:Ext.isSafari ? 4 : 2
,id: 'actions'
});
this.rowActions.on('action', this.onRowAction, this);
Ext.apply(this, {
store: new Ext.data.Store({
autoDestroy: true,
reader : new Ext.data.JsonReader({
id : 'infID',
totalProperty : 'totalCount',
root : 'rows',
fields : [{
name : 'infID',
type : 'int'
}, {
name : 'partnum',
type : 'string'
}, {
name : 'site'
}, {
name : 'program'
}, {
name : 'partdesc',
type : 'string'
}, {
name : 'production',
type : 'string'
}, {
name : 'pstcode'
}, {
name : 'qclauses',
type : 'string'
}, {
name : 'action1',
type : 'string'
}, {
name : 'qtip1',
type : 'string'
}, {
name : 'hazmat',
type : 'bool'
}
]
}),
proxy : new Ext.data.HttpProxy({
url : "static/data/data1.json"
}),
baseParams : {
cmd : 'getData',
objName : this.objName
},
sortInfo : {
field : 'partnum',
direction : 'ASC'
},
remoteSort : true,
listeners : {
load : {
scope : this,
fn : function(store) {
// keep modified records accros paging
var modified = store.getModifiedRecords();
for (var i = 0; i < modified.length; i++) {
var r = store.getById(modified[i].id);
if (r) {
var changes = modified[i].getChanges();
for (p in changes) {
if (changes.hasOwnProperty(p)) {
r.set(p, changes[p]);
}
}
}
}
}
}
}
}),
columns:[{
header : 'Part Number',
id : 'partnum',
dataIndex : 'partnum',
width : 135,
editor : new Ext.form.TextField({
allowBlank : false
}),
sortable : true
}, {
header : 'Site',
dateIndex : 'site',
width: 60,
editor : new Ext.form.ComboBox({
typeAhead:true,
triggerAction:'all',
lazyRender:true,
mode:'local',
store:siteDs,
valueField:'id',
displayField:'siteLocation'
}),
sortable : true
}, {
header : 'Program',
dataIndex : 'program',
width : 130,
editor : new Ext.form.ComboBox({
typeAhead:true,
triggerAction:'all',
lazyRender:true,
mode:'local',
store:programDs,
valueField:'id',
displayField:'program'
}),
sortable : true
}, {
header : 'Part Description',
width : 300,
editor : new Ext.form.TextField({
allowBlank : false
}),
dataIndex : 'partdesc',
sortable : true
}, {
header : 'Production',
dataIndex : 'production',
width : 80,
editor : new Ext.form.ComboBox({
store:new Ext.data.SimpleStore({
id:0,
fields:['production'],
data:[
['Yes'],
['No']
]
}),
typeAhead:true,
triggerAction:'all',
mode:'local',
editable:false,
forceSelection:true,
valueField:'production',
displayField:'production'
}),
sortable : true
}, {
header : 'PST Code',
dataIndex : 'pstcode',
width : 80,
editor : new Ext.form.ComboBox({
typeAhead:true,
triggerAction:'all',
lazyRender:true,
mode:'local',
store:pstDs,
valueField:'pstNameDisplay',
displayField:'pstNameDisplay'
}),
sortable : true
}, {
header : 'Quality clauses',
width : 180,
editor : new Ext.form.TextField({
allowBlank : true
}),
dataIndex : 'qclauses',
sortable : true
},this.checkColumn,this.rowActions]
,plugins:[new Ext.ux.grid.Search({
iconCls : 'icon-zoom',
readonlyIndexes : ['program'],
disableIndexes : ['hazmat']
}),this.rowActions,this.recordForm,this.checkColumn]
,viewConfig:{forceFit:true}
,buttons: [{
text:'Save'
,iconCls:'icon-disk'
,scope:this
,handler:this.commitChanges
},{
text:'Reset'
,iconCls:'icon-undo'
,scope:this
,handler:function() {
this.store.each(function(r) {
r.reject();
});
this.store.modified = [];
// this.store.rejectChanges();
}
}]
,tbar:[{
text:'Add Record'
,tooltip:'Add Record to Grid'
,iconCls:'icon-plus'
//,id:'btn-add'
,listeners:{
click:{scope:this, fn:this.addRecord,buffer:200}
}
},{
text:'Add Record'
,tooltip:'Add Record with Form'
,iconCls:'icon-form-add'
,listeners:{
click:{scope:this, buffer:200, fn:function(btn) {
this.recordForm.show(this.addRecord(), btn.getEl());
}}
}
}]
});//eo apply
this.bbar = new Ext.PagingToolbar({
store:this.store
,displayInfo:true
,pageSize:10
});
//call parent
Application.PartsInfo.superclass.initComponent.apply(this,arguments);
}//eo function initComponent
,onRender:function() {
// call parent
Application.PartsInfo.superclass.onRender.apply(this, arguments);
// load store
this.store.load({params:{start:0,limit:10}});
} // eo function onRender
// }}}
// {{{
,addRecord:function() {
var store = this.store;
if(store.recordType) {
var rec = new store.recordType({newRecord:true});
rec.fields.each(function(f) {
rec.data[f.name] = f.defaultValue || null;
});
rec.commit();
store.add(rec);
return rec;
}
return false;
} // eo function addRecord
// }}}
// {{{
,onRowAction:function(grid, record, action, row, col) {
switch(action) {
case 'icon-minus':
this.deleteRecord(record);
break;
case 'icon-edit-record':
this.recordForm.show(record, grid.getView().getCell(row, col));
break;
}
} // eo onRowAction
// }}}
// {{{
,commitChanges:function() {
var records = this.store.getModifiedRecords();
if(!records.length) {
return;
}
var data = [];
Ext.each(records, function(r, i) {
var o = r.getChanges();
if(r.data.newRecord) {
o.newRecord = true;
}
o[this.idName] = r.get(this.idName);
data.push(o);
}, this);
var o = {
url:this.url
,method:'post'
,callback:this.requestCallback
,scope:this
,params:{
cmd:'saveData'
,objName:this.objName
,data:Ext.encode(data)
}
};
Ext.Ajax.request(o);
} // eo function commitChanges
// }}}
// {{{
,requestCallback:function(options, success, response) {
if(true !== success) {
this.showError(response.responseText);
return;
}
try {
var o = Ext.decode(response.responseText);
}
catch(e) {
this.showError(response.responseText, 'Cannot decode JSON object');
return;
}
if(true !== o.success) {
this.showError(o.error || 'Unknown error');
return;
}
switch(options.params.cmd) {
case 'saveData':
var records = this.store.getModifiedRecords();
Ext.each(records, function(r, i) {
if(o.insertIds && o.insertIds[i]) {
r.set(this.idName, o.insertIds[i]);
delete(r.data.newRecord);
}
});
this.store.each(function(r) {
r.commit();
});
this.store.modified = [];
// this.store.commitChanges();
break;
case 'deleteData':
break;
}
} // eo function requestCallback
// }}}
// {{{
,showError:function(msg, title) {
Ext.Msg.show({
title:title || 'Error'
,msg:Ext.util.Format.ellipsis(msg, 2000)
,icon:Ext.Msg.ERROR
,buttons:Ext.Msg.OK
,minWidth:1200 > String(msg).length ? 360 : 600
});
} // eo function showError
// }}}
// {{{
,deleteRecord:function(record) {
Ext.Msg.show({
title:'Delete record?'
//,msg:'Do you really want to delete <b>' + record.get('company') + '</b><br/>There is no undo.'
,msg:'Do you really want to delete <b>' + '</b><br/>There is no undo.'
,icon:Ext.Msg.QUESTION
,buttons:Ext.Msg.YESNO
,scope:this
,fn:function(response) {
if('yes' !== response) {
return;
}
// console.info('Deleting record');
}
});
} // eo function deleteRecord
// }}}
}); // eo extend
var siteDs = new Ext.data.XmlStore({
autoDestroy : true,
url : '/rest/sites/all',
record : 'Sites',
restful : true,
autoLoad : true,
fields : ['id', 'site', 'location', 'siteLocation']
});
var pstDs = new Ext.data.XmlStore({
autoDestroy: true,
url:'/rest/psts/all',
record: 'Psts',
restful:true,
autoLoad: true,
fields:['id','pst','pstName','pstNameDisplay']
});
var programDs = new Ext.data.XmlStore({
autoDestroy: true,
url:/rest/programs/all',
record: 'programs',
restful:true,
autoLoad: true,
fields:['id','program']
});
//register xtype
Ext.reg('partinfo', Application.PartsInfo);
Originally Posted by jsakalos
Can someone look this over and tell me what is wrong?
Reply With Quote