ExtJS Panel（引用页）刷新问题

 

引用页刷新的问题不仅仅体现在TabPanel里，只要是带load的panel都是适用的～怎么让一个panel去刷新和更新呢？
更新的话很容易，只要调用Ext.Panel.load()就可以，panel会自动用load方法里的参数去更新panel。
load的官方描述如下：
load( Object/String/Function config ) : Ext.Panel
Loads this content panel immediately with content returned from an XHR call.
那么按理说，我们要刷新的话，只要用load方法，传进原来的参数就可以实现刷新了，但是对于TabPanel这种，panel很多，ExtJS的Panel本身没有得到URL的方法，自己记录管理URL又太麻烦，要是能让他有reload方法就好了。其实是可以reload的，只是这个方法不在Panel里，往下看！
我们先来看一下，panel是用什么去ajax加载引用另一个页面的。我们看下Panel的autoLoad，对于autoLoad的官方描述如下：
autoLoad : Object/String/Function
A valid url spec according to the Updater Ext.Updater.update method. If autoLoad is not null, the panel will attempt to load its contents immediately upon render.
The URL will become the default URL for this panel's body element, so it may be refreshed at any time.

原来Panel的autoLoad是借助Ext.Updater，在Updater的Method里，我们发现有这样一个方法：
refresh( [Function callback] ) : void
Refresh the element with the last used url or defaultUrl. If there is no url, it returns immediately
Parameters:
callback : Function
(optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
Returns:
void
看看，Updater本身是有刷新的方法的，那么接下来只要找到Panel和Updater的关联的方法，就可以让Panel自己刷新了。
Panel里有个叫getUpdater()的方法，官方描述如下：
getUpdater() : Ext.Updater
Get the Ext.Updater for this panel. Enables you to perform Ajax updates of this panel's body.
Parameters:
None.
Returns:
Ext.Updater

问题解决了，我们来写2个function去分别封装下panel的“更新”和“刷新”：

 

//刷新一个panel function Panel_Refesh(panelObj) { //panelObj是Ext.Panel panelObj.getUpdater().refresh(); } //更新一个panel function Panel_URLUpdate(panelObj,newURL) { //panelObj是Ext.Panel，newURL是一个String panelObj.load(newURL); }

Further more，针对TabPanel：（假设变量_myTabs是TabPanel的句柄，全局的）

function TabPanel_RefreshActiveTab() { _myTabs.getActiveTab().getUpdater().refresh(); } function TabPanel_RefreshTab(panelID) { var x=_myTabs.getCmp(panelID); if(x) { _myTabs.setActiveTab(x); x.getUpdater().refresh(); } }