ThisComponent.window.UpdateResource = function(config) {
this.ident = config.ident || 'this-component-window-du';
Ext.applyIf(config,{
id: this.ident
,width: 500
,title: 'Update Worker'
,url: ThisComponent.config.connectorUrl
,action: 'mgr/doctors/update'
,fields: [{
xtype: 'hidden'
,name: 'id'
,value: true
},
// My broken code. :-\
{
xtype: 'this-component-checkboxgroup-locations'
,fieldLabel: 'Locations'
,fieldValue: 'id'
,root: "results"
,url: PD.config.connectorUrl
,items: LocationsItems
,baseParams: {
action: "mgr/locations/getCheckboxList"
,practice: ThisComponent.request.parentname
}
},{
fieldLabel: 'First Name'
,name: 'first_name'
,xtype: 'textfield'
,width: 300
,allowBlank: false
},{
fieldLabel: 'Last Name'
,name: 'last_name'
,xtype: 'textfield'
,width: 300
,allowBlank: false
},{
fieldLabel: 'Specialty'
,name: 'specialty'
,xtype: 'this-component-combo-fullspecialty'
,width: 300
,allowBlank: false
}]
});
ThisComponent.window.UpdateResource.superclass.constructor.call(this,config);
};
Ext.extend(ThisComponent.window.UpdateResource,MODx.Window, {});
Ext.reg('this-component-window-doctor-update',ThisComponent.window.UpdateResource);
LocationsItems = [];
Ext.namespace("Ext.checkboxgroup");
Ext.checkboxgroup.RemoteCheckboxGroup = function(config) {
config = config || {};
var resourceStore = new Ext.data.JsonStore({
url: this.url
,root: "results"
,baseParams: this.baseParams
,fields: ["id", "name"]
,autoLoad: false
,listeners: {
load: function(t, records, options) {
// for(var i = 0; i < records.length; i++) {
// LocationsItems.push({id: records[i].data.id, boxLabel: records[i].data.name});
// }
}
}
});
resourceStore.load();
Ext.checkboxgroup.RemoteCheckboxGroup.superclass.constructor.call(this, config);
};
Ext.extend(Ext.checkboxgroup.RemoteCheckboxGroup,Ext.form.CheckboxGroup);
Ext.reg('this-component-checkboxgroup-locations',Ext.checkboxgroup.RemoteCheckboxGroup);
PD.combo.Locations = function(config) {
config = config || {};
Ext.applyIf(config,{
name: 'locations'
,hiddenName: 'locations'
,displayField: 'name'
,valueField: 'id'
,multiSelect: true // not creating a multiselect
,fields: ['id','name']
,url: ThisComponent.config.connectorUrl
,baseParams: {
action: "mgr/locations/getCheckboxList"
,practice: ThisComponent.request.parentname
}
});
ThisComponent.combo.Locations.superclass.constructor.call(this,config);
};
Ext.extend(ThisComponent.combo.Locations,MODx.combo.ComboBox);
Ext.reg('this-component-combo-locations',ThisComponent.combo.Locations);
Thank you, and you have a sample and tutorial link for that, correct?
1) that this component already has it's own extensions of Ext, 2) I don't see the advantage of investing the time to install yet another add on to find it won't work (I will likely break it or get something horribly wrong)
If I were coding outside this framework it would be done.you can create CMPs also without using Ext or you can create something on the frontend or, if you want to use Ext in the manager, but have not the ext-knowledge, you can try to solve it with help of MIGXdb, or you can ask for help on the ext-forums for ext-related questions.
This is built off of the core modx combo box, as best as I can gather.
Ext.namespace("Ext.checkboxgroup");
Ext.checkboxgroup.RemoteCheckboxGroup = function(config,getStore) {
config = config || {};
Ext.applyIf(config,{
fieldValue: 'id'
,fields: ["id", "name"]
,items: []
});
Ext.applyIf(config,{
store: new Ext.data.JsonStore({
url: ThisComponent.config.connectorUrl
,autoLoad: true
,root: "results"
,totalProperty: 'total'
,fields: config.fields
,errorReader: MODx.util.JSONReader
,remoteSort: config.remoteSort || false
,autoDestroy: true
,baseParams: {
action: "mgr/locations/getCheckboxList"
,practice: ThisComponent.request.parentname
}
,listeners: {
load: function(t, records, options) {
items = [];
for(var i = 0; i < records.length; i++) { //console.log (records[i].data.id);
items.push({id: records[i].data.id, boxLabel: records[i].data.name});
}
console.log(items);
}
}
})
});
if (getStore === true) {
config.store.load();
return config.store;
}
Ext.checkboxgroup.RemoteCheckboxGroup.superclass.constructor.call(this,config,getStore);
this.config = config;
return this;
};
Ext.extend(Ext.checkboxgroup.RemoteCheckboxGroup,Ext.form.CheckboxGroup);
Ext.reg('this-component-checkboxgroup-locations',Ext.checkboxgroup.RemoteCheckboxGroup);
PD.window.UpdateResource = function(config) {
this.ident = config.ident || 'pd-window-du';
Ext.applyIf(config,{
id: this.ident
,width: 500
,title: 'Update Worker'
,url: PD.config.connectorUrl
,action: 'mgr/workers/update'
,fields: [{
xtype: 'hidden'
,name: 'id'
,value: true
},{
xtype: 'this-component-checkboxgroup-locations'
,fieldLabel: 'Locations'
,items: []
},{
fieldLabel: 'First Name'
,name: 'first_name'
,xtype: 'textfield'
,width: 300
,allowBlank: false
},{
fieldLabel: 'Last Name'
,name: 'last_name'
,xtype: 'textfield'
,width: 300
,allowBlank: false
},{
fieldLabel: 'Specialty'
,name: 'specialty'
,xtype: 'this-component-combo-fullspecialty'
,width: 300
,allowBlank: false
}]
});
ThisComonent.window.UpdateDoctor.superclass.constructor.call(this,config);
};
Ext.extend(ThisComponent.window.UpdateResource,MODx.Window, {});
Ext.reg('this-component-window-resource-update',ThisComponent.window.UpdateResource);
var glbl_locations_items = [{"boxLabel":"None"}];
var glbl_locations_store = new Ext.data.JsonStore({
//url: ThisComponent.config.connectorUrl // out of scope here, so we hard-coded to get it to work
url:'/assets/components/this-component/connector.php'
,autoLoad: false
,root: "results"
,totalProperty: 'total'
,fields: ["id", "name"]
,remoteSort: false
,autoDestroy: true
,baseParams: {
action: "mgr/workers/getCheckboxList"
,parent_id: MODx.request.parentname // ditto, "thisComponent" not created yet
}
,listeners: {
load: function(t, records, options) { console.log('loadData');
glbl_locations_items = [];
for(var i = 0; i < records.length; i++) { //console.log (records[i].data.id);
glbl_locations_items.push({id: records[i].data.id, boxLabel: records[i].data.name});
console.log(' load items ' + records[i].data.name);
}
return glbl_locations_items;
}
}
});
Ext.applyIf(config,{
store: glbl_locations_store
});
{
xtype: 'this-component-checkboxgroup-locations'
,fieldLabel: 'Locations'
,items: glbl_locations_items
},{
if (!this.windows.updateWorker) {
this.windows.updateDoctor = MODx.load({
xtype: 'pd-window-doctor-update'
,record: r
,listeners: {
,'success': {fn:function(r) {
Ext.getCmp('pd-grid-doctors').getStore().load();
},scope:this}
}
});
}
if (!this.windows.updateWorker) {
this.windows.updateWorker = MODx.load({
xtype: 'this-component-update'
,record: r
,listeners: {
beforerender: { fn: function() {glbl_locations_store.load(); } }
,'success': {fn:function(r) {
Ext.getCmp('pd-grid-workers').getStore().load();
},scope:this}
}
});
}