学习ExtJS一段时间以后，大家基本都会对于一些显示数据的组件不太符合需求，可能自己需要的组件在ExtJS里面不存在，这是大家基本就会使用Html属性，直接使用Html进行绘制页面数据展现。
但是，使用ExtJS的templete技术，可以简化html里面的数据绑定。
之后发现，ExtJS 的组件都是html构成，但是它有一个模版tpl，这是html的本质，可以组建自己的tpl，进而重新绘制组件模版，这样就会符合我们的要求。
tpl：里面也有自己的语法-for,if等。
combox，Grid，Tree都是使用模版机制，如果我们觉得其显示效果不符合我们的要求，我们可以复写tpl来实现，再doRender渲染即可。
==============================================================================================
实现基于下拉框的表格就是基于模板的实现
实现下拉树就是模板
==============================================================================================
模糊查询：
目前对于extjs组件类似于googe的自动提示，的看是如何实的
模版：里面可以有执行函数。
var tpl = new Ext.XTemplate(
'<p>Name: {name}</p>',
'<p>Company: {[values.company.toUpperCase() + ", " + values.title]}</p>',
'<p>Kids: ',
'<tpl for="kids">',
'<div class="{[xindex % 2 === 0 ? "even" : "odd"]}">',
'{name}',
'</div>',
'</tpl></p>'
);
tpl.overwrite(panel.body, data);
var tpl = new Ext.XTemplate(
'<p>Name: {name}</p>',
'<p>Kids: ',
'<tpl for="kids">',
'<tpl if="this.isGirl(name)">',
'<p>Girl: {name} - {age}</p>',
'</tpl>',
'<tpl if="this.isGirl(name) == false">',
'<p>Boy: {name} - {age}</p>',
'</tpl>',
'<tpl if="this.isBaby(age)">',
'<p>{name} is a baby!</p>',
'</tpl>',
'</tpl></p>', {
isGirl: function(name){
return name == 'Sara Grace';
},
isBaby: function(age){
return age < 1;
}
});
tpl.overwrite(panel.body, data);