Wednesday, March 28, 2012

Treeview in Updatepanel gets lost when selecting node

We moved to the Beta and then our treeviews in updatepanels started acting strangely. Especially when a node was selected in a treeview that was populated in code after the first page load. It "randomly" collapses and expands nodes as you select a node. Its like its viewstate is messed up or ...

This behavior doesn't occur if the whole treeview i expanded when finished populating it. But it doesn't look so good if it's all expanded. Does anyone know how to collapse all nodes client side ? Cause that might be a workaround - serverside expand all nodes after populating and then clientside collapsing them - server side collapsing gives the random behaivor back !

I read some articles about how the treeviews scripts aren't registered in the scriptmanager which is required in Beta 1. And how treeviews i update panels aren't supported since the rarely are used that way. But the app doesn't look so good when a frequently used treeview causes a full postback of the page just to select a node - which Atlas updatepanel handled great and pretty quick in the AJAX Beta it doesn't work as well at all and is much slower.

Does anyone have the same problem or better yet a workaround while waiting for AJAX updatepanel supporting a treeview

We are having the same problem with the RC release. I didn't try it with other releases.

I use this script to open/close the treeview, with a little adjustment it should work for you too. Hope it helped

function

CloseTree(treeId)

{

//childnodes are contained in divsvar subDivs = document.getElementById(treeId).getElementsByTagName("div");for (i=0; i<subDivs.length; i++)

{

//tree lines are images contained in divs also, so we don't hide them because they will not be shown when the node is toggled into viewif (subDivs[i].id.length >0)

{

subDivs[i].style.display =

'none';

}

}

var imgs = document.getElementById(treeId).getElementsByTagName("img");for (j=0; j<imgs.length; j++ )

{

if ( imgs[j].alt.indexOf("Collapse") >=0 )

{

imgs[j].src = <%=

"'" + Page.ResolveURL("~/") +"'"%>+"Images/tree_collapsed.gif";

imgs[j].alt = imgs[j].alt.replace(

"Collapse","Expand");

}

}

}

function OpenTree(treeId)

{

//childnodes are contained in divsvar subDivs = document.getElementById(treeId).getElementsByTagName("div");for (i=0; i<subDivs.length; i++)

{

subDivs[i].style.display =

'block';

}

var imgs = document.getElementById(treeId).getElementsByTagName("img");for (j=0; j<imgs.length; j++ )

{

if ( imgs[j].alt.indexOf("Expand") >=0 )

{

imgs[j].src = <%=

"'" + Page.ResolveURL("~/") +"'"%> +"Images/tree_expanded.gif";

imgs[j].alt = imgs[j].alt.replace(

"Expand","Collapse");

}

}

}


I have the same issue. Were you able to resolve it? Would appreciate any feed back.

Grewal.

No comments:

Post a Comment