由于工作需要，封装了ExtJS4，GridPanel列头带有复选框的列，
代码如下：
/**
* 列头带有复选框的列
*
*/
Ext.define("org.pine.widget.CheckBoxColumn", {
extend : "Ext.grid.column.Column",
xtype : 'xcc_cfets_checkboxcolumn',
requires:[
],
/** 属性定义 */
config:{
}, constructor: function (config) {
console.info(this.$className+'==>'+arguments.callee.name);
var self = this;
self.initConfig(config);//初始化配置
self.callParent(arguments);//调用父类构造方法
},
initComponent: function () {
console.info(this.$className+'==>'+arguments.callee.name);
var self = this;
self.addEvents('xcc_cfets_checkboxcolumn_checked');
var renderTpl =
'<div id="{id}-titleEl" {tipMarkup}class="' + Ext.baseCSSPrefix + 'column-header-inner">' +
"<input type='checkbox'>"+
'<span id="{id}-textEl" class="' + Ext.baseCSSPrefix + 'column-header-text' +
'{childElCls}">' +
'{text}' +
'</span>' +
'<tpl if="!menuDisabled">'+
'<div id="{id}-triggerEl" class="' + Ext.baseCSSPrefix + 'column-header-trigger' +
'{childElCls}"></div>' +
'</tpl>' +
'</div>' +
'{%this.renderContainer(out,values)%}';
self.renderTpl=renderTpl;
self.renderSelectors= {
checkbox: "input[type='checkbox']"
};
self.callParent(arguments);
self.on('afterrender',function(comp, eOpts ){
var checkboxDom = comp.checkbox.dom;//复选框
checkboxDom.onclick = function (event) {
console.info("复选框选中状态==>"+checkboxDom.checked);
comp.fireEvent('xcc_cfets_checkboxcolumn_checked',comp,checkboxDom,checkboxDom.checked);
event.stopPropagation();//停止事件向上传播
};
});
},
/**
* 获取复选框的选中状态
*/
isChecked: function () {
return this.checkbox.dom.checked;
},
/**
* 设置复选框的选中状态
* @param checked 是否选中
*/
setChecked: function (checked) {
this.checkbox.dom.checked = checked;
}
});