Load ASCX controls dynamically using AJAX

Question

I'm developing an ASP.NET application and I'm trying to do the following:

I'm going to have only one ASPX page splitted into two columns. On the left column is going to be a TreeView, and on the right column is going to be something to edit treeview's nodes.

When the user can select a treeview's node to edit on the right column. Depending on the node's depth fields on right column will vary.

I wondering to use ASCX controls and load on right column dynamically using AJAX, for example. Is there a better choice? Can I do that?

EDIT:

I don't want to reload the entire page when the user wants to edit a treeview's node. Maybe I'm going to need an UpdatePanel on the right column, isn't it?

Answer 1

Wrap your treeview inside an UpdatePanel, and add the following code in the code-behind. (assuming your right panel is called 'PanelOnTheRight', and you have a usercontrol 'MyEditControl' with a property 'IdToEdit').

void MyTreeView_SelectedNodeChanged(Object sender, EventArgs e)
{
    PanelOnTheRight.Controls.Clear();

    MyEditControl editControl = LoadControl("~/usercontrols/mycontrol.ascx");
    editControl.IdToEdit = ((TreeView)sender).SelectedNode.Value;

    PanelOnTheRight.Controls.Add(editControl);
}

Answer 2

In general, yes this can be done and is not so hard to accomplish with the different .NET ajax frameworks.

It is difficult to suggest a "better choice" because that depends on how you build your application and the different requirements for it.

Answer 3

You can use Page.LoadControl method to load user controls. But I am not sure whether it works with Ajax