Accessing Client-Side State of RadListBox during RadTreeView NodeExpand event

[ColinBowern]

I have a RadTreeView control which has a list of possible choices.  When expanding a root node I want to display only those choices which have not been selected (listed in a RadListBox).  When I wire up the NodeExpand event as follows the Items collection of the RadListBox always returns zero items.

protected void AvailableOptions_NodeExpand(object sender, RadTreeNodeEventArgs e)
{
    var selectedOptions = ItemForm.FindControl("SelectedOptions") as RadListBox;
    var data = service.RetrieveAvailableOptions(e.Node.Value);
    foreach (var item in data)
    {
        if (selectedOptions.FindItemByValue(item.Key) == null)
        {
            var node = new RadTreeNode(string.Format("{0} - {1}", item.Key, item.Value), item.Key) { Checked = e.Node.Checked };
            e.Node.Nodes.Add(node);
        }
    }
}

The RadListBox items are populated on the client side using the following script:

function Add_Click() {
    var availableOptions = $find('<%= ItemForm.FindControl("AvailableOptions").ClientID %>');
    var selectedOptions = $find('<%= ItemForm.FindControl("SelectedOptions").ClientID %>');

    availableOptions.trackChanges();
    selectedOptions.trackChanges();

    var checkedNodes = availableOptions.get_checkedNodes();
    for (var i = 0; i < checkedNodes.length; i++) {
        if (checkedNodes[i].get_level() == 1) {
            var item = selectedOptions.findItemByValue(checkedNodes[i].get_value());
            if (item == null) {
                item = new Telerik.Web.UI.RadListBoxItem();
                item.set_text(checkedNodes[i].get_text());
                item.set_value(checkedNodes[i].get_value());
                selectedOptions.get_items().add(item);
            }

            checkedNodes[i].get_parent().get_nodes().remove(checkedNodes[i]);
        }
    }

    for (var i = 0; i < checkedNodes.length; i++) {
        checkedNodes[i].uncheck();
    }

    selectedOptions.commitChanges();
    availableOptions.commitChanges();
}

I have added both controls to the RadAjaxManagerProxy to ensure ViewState is populated.

<telerik:RadAjaxManagerProxy runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="AvailableOptions">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="AvailableOptions" />
                <telerik:AjaxUpdatedControl ControlID="SelectedOptions" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManagerProxy>

What am I missing here?

[Yana]

Hi Colin,

I guess that you've set ExpandMode property of the nodes to "ServerSideCallBack", in this case the treeview makes asynchronous request to the server and the other controls cannot be accessed in the NodeExpand event. You should use "ServerSide" ExpandMode.

Regards,
Yana
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.