玄幻小说完本_[ExtJS 6]Grid分頁(yè)工具欄無(wú)效問(wèn)題解決| 成都西華升騰科技有限公司

Ext JS開(kāi)發(fā)大全

CmsWing

[ExtJS 6]Grid分頁(yè)工具欄無(wú)效問(wèn)題解決

## [ExtJS 6]Grid分頁(yè)工具欄無(wú)效問(wèn)題解決
### 前情描述：
Ext JS中，Grid上可以使用tbar或bbar等添加分頁(yè)的工具欄。一般狀況下，該分頁(yè)工具欄可以和該Grid的Store自動(dòng)綁定，也就是可以自動(dòng)顯示筆數、頁(yè)數等信息。
在Grid中添加的代碼如下：
```javascript
tbar:{
xtype: ‘pagingtoolbar’,
displayInfo: true
}
```
### 問(wèn)題描述：
如果在tbar中添加除’pagingtoolbar’的其他按鈕之后，分頁(yè)工具欄自動(dòng)綁定Store就會(huì )失效。添加其他按鈕的配置如下：
```javascript
tbar: [{
xtype : ‘button’,
text : ‘Select’,
iconCls : ‘x-fa fa-plus’
},{
xtype: ‘pagingtoolbar’,
//store:‘NplmPnmPkgInfoStore’,
displayInfo: true
}]
```
### 解決方法：
思路：
1.'pagingtoolbar’提供了綁定store的方法，思路是手動(dòng)綁定一次。
2. 綁定的時(shí)機設定在Grid渲染完成之后。通過(guò)afterrender事件觸發(fā)。
實(shí)現如下：

```javascript
listeners:{  
	afterrender:function(thisGrid){	    
		var pagingtoolbars = this.query("pagingtoolbar");	 
		if(pagingtoolbars!=null){	    
			var  pagingtoolbar = pagingtoolbars[0];
			pagingtoolbar.setStore(thisGrid.getStore());
		}   
	}   
}
```

當然，也可以將按鈕放到Grid之外，不過(guò)就會(huì )占用更多的頁(yè)面空間。
以上方式的好處是，如果該場(chǎng)景較多，該處理可以放在父類(lèi)的定義上，子類(lèi)自動(dòng)繼承。

98国产在线视频福利_欧亚v视频日韩一区二区_国产在线精彩视频_亚洲伊人久久综合影院_亚洲欧美高清激情精品一区_少妇熟女天堂网av_午夜福利日本专区_中美女子成人毛片_大荫蒂毛茸茸视频国产_小14萝裸体自慰洗澡大尺度

購物車(chē)

0 ITEMS ON YOUR CART

Ext JS開(kāi)發(fā)大全

[ExtJS 6]Grid分頁(yè)工具欄無(wú)效問(wèn)題解決

網(wǎng)站導航