Inter-component Communication and App Design
I've been working seriously on learning Ext JS for about a week now and it's mostly coming together pretty well for me. But I'm a bit stuck on figuring out how to pass events around (or, perhaps, how Ext passes them about); in other words, how to do inter-component communication. I've read both Writing a Big Application in Ext (Parts 1 & 2) and I've studied Saki's Ext Example. So far as I can determine, the key bits in his example are as follows:
Code:
tpl:new Ext.XTemplate('<tpl for="links"><a class="examplelink" href="{href}">{text}</a></tpl>')
(add a custom classname to the items whose events I want to capture so that they can be "identified" later)
Code:
this.linksPanel.on({
scope:this
,render:function() {
this.linksPanel.body.on({
scope:this
,click:this.onLinkClick
,delegate:'a.examplelink'
,stopEvent:true
});
}
});
(I really have no understanding of exactly what this is doing, but it seems to be the key to getting the 'linkClick' events out to the parent)
Code:
,onLinkClick:function(e, t) {
var title = t.innerHTML;
var tab = this.tabPanel.items.find(function(i){return i.title === title;});
if(!tab) {
tab = this.tabPanel.add({
title:title
,layout:'fit'
,activate:true
});
}
this.tabPanel.setActiveTab(tab);
} // eo function onLinkClick
(this is, obviously, what is ultimately handling the events)
So here are my questions:
1. What exactly is happenning in the 2nd snippet above?
2. Is this the only way to do interprocess communication?
3. Is this the best way to do interprocess communication?
4. Are there any other Examples, FAQs, Posts, etc. where I might find more info on this topic?
Thanks,
Ron
Thanks