Tuesday, March 4, 2008

Asp.net TreeView state

Don't you ever wanted to preserve the tree status over multiple pages? I searched for many times and found the solution.

  1. use cookies
  2. javascript override functions
  3. TreeView javascript important functions

  1. these script assign a value to cookie:

function getCookieVal (offset)
{
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}

function GetCookie (name)
{
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < style="color: rgb(51, 51, 255);">var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}

function SetCookie (name, value)
{
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}

function DeleteCookie (name)
{
var exp = new Date();
exp.setTime (exp.getTime() - 1000000000); // This cookie is history (changed -1 to make it previous time)
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}


2-

To override the function in JavaScript, simply define a new variable to hold the old function, and redefine the old function variable as a new function. Here’s the syntax:

var base_TreeView_ToggleNode = TreeView_ToggleNode;

TreeView_ToggleNode = function(data, index, node, lineType, children){

base_TreeView_ToggleNode(data, index, node, lineType, children);

setProfileFolder(data, index,node,children);

return;

}
The setProfileFolder function is our addition to the base method.

see the original reference here.

3- Now you have to see the important functions and concepts about the treeview control

  • TreeView_GetNodeText(node): it takes a node object and returns the node name
believe me it is good, if you want to try to get it by your self you will fail, the structure is so complicated.

  • Facing the similar nodes in text but in different branches:
This is why the index thing exists. The tree view in javascript collect all items in javascript in an array. So, if you have:

Parent
+ child 01
--+child 02
-----leaf

it will be indexed like this

Parent [0]
+ child 01 [1]
--+child 02 [2]
-----leaf [3]

  • you can navigate through the child nodes like this
var childNodes = children.getElementsByTagName("a");
var increment = 0;
for(;incrementvar child_node_name = TreeView_GetNodeText(childNodes[increment]) ;
}


In the server side parse the cookie back and preserve the collapse/expand behaviour.

6 comments:

  1. looks like exactly what I am looking for. Thanks!

    ReplyDelete
  2. it is very kind of you to comment on my blog.

    I checked yours too and it contains more info and guidance than I have. You are a catalog man :)

    After all, thanks.

    ReplyDelete
  3. I wish not agree on it. I think warm-hearted post. Particularly the designation attracted me to review the intact story.

    ReplyDelete
  4. Nice fill someone in on and this mail helped me alot in my college assignement. Say thank you you for your information.

    ReplyDelete
  5. DIGITAL MARKETING AGENCY provides Digital Solutions to clients spread across the globe. Our services provide ethical Digital Marketing Services which offer innovative solutions From the past 6 years. We are providing different types of Digital Marketing Services like Search Engine Optimization (SEO), Social Media Marketing (SMM), Pay Per Click (PPC), Content Marketing (CM), Email Marketing (EM), Web Designing. The team of DIGITAL MARKETING AGENCY is informing that, Every kind of Digital Marketing Service will be available with a good commitment for all types of business holders in Dubai, UAE.
    ADVERTISING COMPANIES IN UAE

    ReplyDelete