To be honest I'm not exactly sure how you want to obtain the id and what you want to do with it.
Do you want to be able to click a resource in the tree and pick up it's id, in the same way that you can select a parent when editing a resource? If that's the case, here's how it's been done in that instance (you'll obviously need to adapt it for your requirements):
//from manager/assets/modext/widgets/core/modx.com.js
MODx.ChangeParentField = function(config) {
config = config || {};
Ext.applyIf(config,{
triggerAction: 'all'
,editable: false
,readOnly: false
,formpanel: 'modx-panel-resource'
});
MODx.ChangeParentField.superclass.constructor.call(this,config);
this.config = config;
this.on('click',this.onTriggerClick,this);
this.addEvents({ end: true });
this.on('end',this.end,this);
};
Ext.extend(MODx.ChangeParentField,Ext.form.TriggerField,{
oldValue: false
,oldDisplayValue: false
,end: function(p) {
var t = Ext.getCmp('modx-resource-tree');
if (!t) return;
p.d = p.d || p.v;
t.removeListener('click',this.handleChangeParent,this);
t.on('click',t._handleClick,t);
t.disableHref = false;
MODx.debug('Setting parent to: '+p.v);
Ext.getCmp('modx-resource-parent-hidden').setValue(p.v);
this.setValue(p.d);
this.oldValue = false;
Ext.getCmp(this.config.formpanel).fireEvent('fieldChange');
}
,onTriggerClick: function() {
if (this.disabled) { return false; }
if (this.oldValue) {
this.fireEvent('end',{
v: this.oldValue
,d: this.oldDisplayValue
});
return false;
}
MODx.debug('onTriggerClick');
var t = Ext.getCmp('modx-resource-tree');
if (!t) {
MODx.debug('no tree found, trying to activate');
var tp = Ext.getCmp('modx-leftbar-tabpanel');
if (tp) {
tp.on('tabchange',function(tbp,tab) {
if (tab.id == 'modx-resource-tree-ct') {
this.disableTreeClick();
}
},this);
tp.activate('modx-resource-tree-ct');
} else {
MODx.debug('no tabpanel');
}
return false;
}
this.disableTreeClick();
}
,disableTreeClick: function() {
MODx.debug('Disabling tree click');
t = Ext.getCmp('modx-resource-tree');
if (!t) {
MODx.debug('No tree found in disableTreeClick!');
return false;
}
this.oldDisplayValue = this.getValue();
this.oldValue = Ext.getCmp('modx-resource-parent-hidden').getValue();
this.setValue(_('resource_parent_select_node'));
t.expand();
t.removeListener('click',t._handleClick);
t.on('click',this.handleChangeParent,this);
t.disableHref = true;
return true;}
,handleChangeParent: function(node,e) {
var t = Ext.getCmp('modx-resource-tree');
if (!t) { return false; }
t.disableHref = true;
var id = node.id.split('_'); id = id[1];
if (id == MODx.request.id) {
MODx.msg.alert('',_('resource_err_own_parent'));
return false;
}
var ctxf = Ext.getCmp('modx-resource-context-key');
if (ctxf) {
var ctxv = ctxf.getValue();
if (node.attributes && node.attributes.ctx != ctxv) {
ctxf.setValue(node.attributes.ctx);
}
}
this.fireEvent('end',{
v: node.attributes.type != 'modContext' ? id : node.attributes.pk
,d: Ext.util.Format.stripTags(node.text)
});
e.preventDefault();
e.stopEvent();
return true;
}
});
Ext.reg('modx-field-parent-change',MODx.ChangeParentField);
And in your CMP:
//from manager/assets/modext/widgets/resource/modx.panel.resource.js
{
xtype: 'modx-field-parent-change'
,fieldLabel: _('resource_parent')
,name: 'parent-cmb'
,id: 'modx-resource-parent'
,value: config.record.parent || 0
}
