CheckboxSelectionModel全选后，点击下一页时还原到未选中状态

在Grid的中使用了CheckboxSelectionModel的时候会发现，在当前页选中了全选按钮，再点击分页按钮时，在新的一页里，header上的全选按钮还是处于选择状态的，下面演示一个笨一点方法：

 

1、在store里加入监听数据变化事件

 

var ds = new Ext.data.Store({
    proxy: new Ext.data.HttpProxy({url:url,form:ff,method:'post'}),
    totalProperty:"totalCount", 
// 这里添加监听数据变化的事件，如果数据发生变休，触发清空checkbox函数
   listeners:{datachanged:clearAllSelectedCheckbox},
    reader:new Ext.data.JsonReader(
	{	root:'result',
		id:'id',
		totalProperty: 'totalCount'
	}, 
	[
		{name:"id"},
		{name:"remark"},
		{name:"domain"},
		{name:"name"}
	
						
)});

 

2、Grid的columns 和生成grid部分的代码就不在这里写了，跟正常情况下的写法一致，分页栏PagingToolbar。

3、clearAllSelectedCheckbox实现代码：

function clearAllSelectedCheckbox(){
	var hd = Ext.fly(grid.getView().innerHd).child('div.x-grid3-hd-checker');
	hd.removeClass('x-grid3-hd-checker-on');
	grid.getSelectionModel().clearSelections();
}

 

 

还可以通过重写PagingToolbar来实现。

评论

2 楼 wj98127 2009-07-07  

没有问题,'div.x-grid3-hd-checker'是css选择器名称,
var hd = Ext.fly(grid.getView().innerHd).child('div.x-grid3-hd-checker');  
hd.removeClass('x-grid3-hd-checker-on');
这一段的意思是说通过css选择器得到多选框的Element,然后将Element的'选中'样式删掉,实际上就是一个样式变更,如果你是初学者,建议你读源码,会很有收获.

1 楼 minma_2009 2009-07-07  

貌似有问题吧。我是个新手，想请教一下：'div.x-grid3-hd-checker'代表什么意思？只能找你这样写好像还是没有用吗？