How to mark Indeterminate on node with ExpandMode = ServerSide?

3 posts, 0 answers
  1. Rubens
    Rubens avatar
    28 posts
    Member since:
    Mar 2008

    Posted 17 Aug 2010 Link to this post

    Hi ALL,

    I need to build a large treeview struture using ExpandMode = ServerSide and I wish to mark some nodes as "Indeterminate". How can I do that? I have this code so far:

    treeview.Nodes.Clear();
    foreach (var item in collection)
    {
        treeview.Nodes.Add(new RadTreeNode
        {
            Text = item.Text,
            Value = item.Id.ToString(),
            Checked = item.Aplicabilidade.Any(aplic => aplic.Area.Id == filtroEmpresas.SelectedValue),
            ExpandMode = TreeNodeExpandMode.ServerSide,
            // CheckStatus = Indeterminate  //(readonly, doesn't works)
            // CssClass = "rtIndeterminate" //(doesn't render correctly)
        });
    }

    Thanks in advance,

    Rubens
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 18 Aug 2010 Link to this post

    Hello,


    I am not sure about this can be achieved by setting the property individually for nodes.

    Probably, you can set the "TriStateCheckBoxes"  property of the treeview to true and chnage the checkbox status from client side for each node, according whether you need Indeterminate state or not.
    These links will be helpful in handling client side methods for treeview.
    Client-Side Programming Basics
    RadTreeNode


    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. TigerCoder
    TigerCoder avatar
    7 posts
    Member since:
    Jun 2007

    Posted 14 Sep 2010 Link to this post

    Rubens,

    First, make sure you need to use LoadOnDemand. If you have a few hundred items in a treeview it may not be necessary.

    Second, if your treeview only needs to retain state on one page during postbacks, you can use PersistLoadOnDemandNodes="true" and your problem is solved.

     

    If, however, you need to setup the first node as indeterminate because you are tracking the user selections in some other form than the treeview, you can do the following but this code will need modification if you have more than one level of hierarchy in your treeview.

     

    1. Set a custom property on the treeview node that you wish to have set as indeterminate
    2. Add a OnClientLoad event
    3. Loop through the nodes client side and fix the rendered CSS class.
    4. Make sure you populate the correct state when you load the treenodes on the server. The RadTreeView will fix the state of the parent node as soon as it's loaded.

    Here's some code snippets that would do it:
    ASPX:

    <telerik:RadTreeView ID="RadTreeView1" runat="server" CheckBoxes="true"
                        OnNodeExpand="RadTreeView1_Expand"
                        OnClientLoad="OnClientLoad"
                        TriStateCheckBoxes="true" CheckChildNodes="true">
    </telerik:RadTreeView>

    Code-behind (setting up the attribute) in C#
    //treeview setup
            RadTreeNode rtn;
            DataTable dtGroups = MyDataIO.GetGroups();
      
            foreach (DataRow dr in dtGroups.Rows)
            {
                rtn = new RadTreeNode(dr["text"].ToString(), dr["value"].ToString());
                // add if statement and test against your business logic. this attribute represents the indeterminate state
                if (true)
                {
                    rtn.Attributes["ind"] = "1";
                    //you can set checked or not checked. I use not checked because this box is just a "select all" box
                    rtn.Checked = false;
                    rtn.ExpandMode = TreeNodeExpandMode.ServerSideCallBack;
                }
                RadTreeView1.Nodes.Add(rtn);
            }
    OnClientLoad method (JavaScript)
    function OnClientLoad(sender, args) {
            var nodelist = sender.get_nodes();
            for (var i = 0; i < nodelist.get_count(); i++) {
                var node = nodelist.getNode(i);
                if (node.get_attributes().getAttribute("ind") == "1") {
                    var elements = node._element.getElementsByTagName("span");
                    for (var j = 0; j < elements.length; j++) {
                        if (elements[j].className == "rtUnchecked" || elements[j].className == "rtChecked")
                            elements[j].className = "rtIndeterminate";
                    }
                }
            }
        }

    !
Back to Top