PDA

View Full Version : Tab panel doens't refresh on Ext.Direct / Asp.Net Mvc Pattern



geewhizbang
27 Jul 2009, 12:08 AM
Since I am somewhat new to MVC in ASP.Net, and also to the Ext.Direct, I am having a strange problem with my tab panel layout.

It works fine as long as I stay on the page, but if I request another url (rather than using a direct request or loading a view page directly into a tab) the tab panel (which is in a master page for both of these urls on the site) works fine for that tab, but then when I go back to the original page by clicking on one of tabs, I get an endless "loading" icon, and the content never fills into the tab.

If I use the back button to go back to the page, it of course work. It only fails when the original page is reloaded by to by a url.

This is probably more of an ASP.net MVC pattern issue than ExtJS. I suspect that there is some request cacheing going on; any additional requests for the same item in a session never returns.

I am preparing my proposal tomorrow for my company to do the whole large next project with heavy use of ExtJS, so it would be very helpful if someone can point me in the right direction to solve this.



<scripttype="text/javascript">
Ext.ns('KnowledgeBase.Master', 'KnowledgeBase.Forum', 'KnowledgeBase.Init');
KnowledgeBase.Init = function()
{
Ext.BLANK_IMAGE_URL = "/content/js/ext/resources/images/default/s.gif";
Ext.UpdateManager.defaults.loadScripts = true;
Ext.Direct.addProvider(KnowledgeBase.Request);
KnowledgeBase.Master();
}
KnowledgeBase.Master = function()
{
PageTabs = new Ext.TabPanel
(
{
renderTo: 'divPageTabs',
stateful: false,
defaults: {autoScroll: false},
height: 1100,
plain:true,
items:
[
{
title: 'Search',
itemId: 'SearchTab',
<% = ((ViewName == "Index") ? "autoLoad: 'kb.mvc/search'" : "listeners: {activate: IndexUrl}") %>
},{
title: 'Glossary',
itemId: 'GlossaryTab',
<% = (ViewName == "Index") ? "autoLoad: 'kb.mvc/glossary'" : "listeners: {activate: IndexUrl}" %>
},{
title: 'Forum',
itemId: 'ForumTab',
<% = ((ViewName == "Index") ? "autoLoad: 'kb.mvc/forum'" : "listeners: {activate: IndexUrl}") %>
},{
title: 'Article',
itemId: 'ArticleTab',
<% = ((ViewName == "Article") ? "listeners: {activate: LoadArticle}" : "listeners: {activate: ArticleUrl}") %>
}
]
}
);
PageTabs.setActiveTab("<% = PageTab %>");
function ArticleUrl()
{
window.top.location = "/kb.mvc/Article";
}
function LoadArticle()
{
var ac = f("divArticleContent");
PageTabs.getComponent("ArticleTab").body.dom.appendChild(ac);
ac.style.display = "";
}
function IndexUrl()
{
window.top.location = "/kb.mvc/Index";
}
}
function ReformatResult(r, rowIdField)
{
var columns = [];
var dt = [];
var rowIdIndex = 0;
for (var col in r[0])
{
if (col == rowIdField) rowIdIndex = columns.length;
columns.push({name: col});
}
for (iRow=0; iRow< r.length; iRow++)
{
dr = [];
for (iCol=0; iCol< columns.length; iCol++)
{
dr[iCol] = r[iRow][columns[iCol].name];
}
dt[iRow] = dr;
}
var store = new Ext.data.ArrayStore({ fields: columns, idIndex: rowIdIndex })
store.loadData(dt);
return store;
}
Ext.onReady(KnowledgeBase.Init);
</script>

<scripttype="text/javascript"src="<% = Url.Content("~/DirectRouter.ashx") %>"></script>
</script>