Add user control dynamically

9 posts, 1 answers
  1. Timo
    Timo avatar
    5 posts
    Member since:
    Oct 2012

    Posted 29 Jan 2012 Link to this post

    Hi,

    I want to add a usercontrol into a node from treeview dynamically, and I think that this node will be inserted in a nodetemplate. I searched through forum, but I didn't find about it.

    If someone knows please tell me.

    Thanks
  2. Answer
    Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 30 Jan 2012 Link to this post

    Hello,

    Try the following code snippet.
    C#:
    protected void Page_Load(object sender, EventArgs e)
      {
          Panel pnl1 = new Panel();
          Control myControl = LoadControl("edit_WebUserControl.ascx");
          RadTreeNode newNode = new RadTreeNode();
          myControl.ID = "ucSection";
          pnl1.Controls.Add(myControl);
          newNode.Controls.Add(pnl1);
          RadTreeView1.Nodes.Add(newNode);
     }

    Thanks,
    Princy.
  3. Timo
    Timo avatar
    5 posts
    Member since:
    Oct 2012

    Posted 30 Jan 2012 Link to this post

    Hi,

    Thanks Princy for your solution.

    I want to work to a tree like in the picture.
    I want to use page methods to load the data. The usercontrol (here it's a  grid, but I want to add a listview) I have to add dynamically because it will be just to the last level of each node.
    I made it to add a usercontrol to OnNodeExpand event, but not in web method. And I saw that if I added the usercontrol to OnNodeExpand event, and I change the page of the grid(or anything else which make a postback), the grid is empty.

    Please give me some help how to do this.
    Thanks,
    Timo
  4. Plamen
    Admin
    Plamen avatar
    2758 posts

    Posted 02 Feb 2012 Link to this post

    Hello,

     
    I tested the functionality the you described but could not observe the issue. Would you please post the code that you are using because it is not very clear how exactly are you adding RadGrid in the node?
     

    All the best,
    Plamen Zdravkov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  5. Timo
    Timo avatar
    5 posts
    Member since:
    Oct 2012

    Posted 02 Feb 2012 Link to this post

    Hi,

    I made it to add userControl in a tree, but just using serverside, not page methods.
    But now I have another issue. The usercontrol is a grid, and if I select another page from grid or click on edit link from grid, the grid disappears, even that I put the grid in radAjaxPanel. I want that just the grid to refresh if I want to edit a row.
    Here is my code: 
    Default.aspx
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            <Scripts>            
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
            </Scripts>
        </telerik:RadScriptManager>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <
    telerik:RadAjaxLoadingPanel ID="LoadingPanel1" runat="server" />
    <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="LoadingPanel1">
                <telerik:RadTreeView ID="RadTreeView1" runat="server" OnNodeExpand="RadTreeView1_NodeExpand">
                </telerik:RadTreeView>
    </telerik:RadAjaxPanel>

    Default.aspx.cs
    protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                LoadRootNodes(RadTreeView1, TreeNodeExpandMode.ServerSide);
            }
        }
     
    private static void LoadRootNodes(RadTreeView treeView, TreeNodeExpandMode expandMode)
        {
            DataTable data = GetData(new SqlCommand("SELECT * FROM ProductCategories WHERE ParentId IS NULL"));
     
            foreach (DataRow row in data.Rows)
            {
                RadTreeNode node = new RadTreeNode();
                node.Text = row["Title"].ToString();
                node.Value = row["CategoryId"].ToString();
                node.Attributes["isLast"] = row["IsLast"].ToString();
                node.ExpandMode = expandMode;
                treeView.Nodes.Add(node);
            }
        }
    protected void RadTreeView1_NodeExpand(object sender, RadTreeNodeEventArgs e)
        {
            DataTable data = GetChildNodes(e.Node.Value);       
            bool isLast = Convert.ToBoolean(e.Node.Attributes["isLast"].ToString());      
     
            if (!isLast)
            {
                foreach (DataRow row in data.Rows)
                {
                    RadTreeNode node = new RadTreeNode();
                    node.Text = row["Title"].ToString();
                    node.Value = row["CategoryId"].ToString();
                    node.Attributes["isLast"] = row["IsLast"].ToString();
                    if (Convert.ToInt32(row["ChildrenCount"]) > 0)
                    {
                        node.ExpandMode = TreeNodeExpandMode.ServerSide;
                    }
                    e.Node.Nodes.Add(node);
                }
            }
            else
            {
                Control myControl = LoadControl("Grid.ascx");           
                RadTreeNode newNode = new RadTreeNode();
                newNode.Value = RadTreeView1.Nodes.Count.ToString();
                newNode.Attributes["isLast"] = "False";
                newNode.ExpandMode = TreeNodeExpandMode.ServerSide;
                myControl.ID = "ucSection";
     
                newNode.Controls.Add(myControl);
     
                e.Node.Expanded = true;
                e.Node.Nodes.Add(newNode);
                 
            }
        }

    And the UserControl is: 
    <telerik:RadAjaxManagerProxy ID="radAjaxProxy" runat="server" />
     
    <telerik:RadAjaxLoadingPanel ID="LoadingPanel1" runat="server" />
    <telerik:RadAjaxPanel runat="server" ID="radAjaxPanel" LoadingPanelID= "LoadingPanel1">
        <telerik:RadGrid ID="RadGrid1" runat="server" CellSpacing="0"
            DataSourceID="SqlDataSource1" GridLines="None"
            AutoGenerateEditColumn="True" PageSize="3">
            <MasterTableView AutoGenerateColumns="False" DataKeyNames="CategoryId" DataSourceID="SqlDataSource1">
                <CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings>
                <RowIndicatorColumn Visible="True" FilterControlAltText="Filter RowIndicator column">
                    <HeaderStyle Width="20px"></HeaderStyle>
                </RowIndicatorColumn>
                <ExpandCollapseColumn Visible="True" FilterControlAltText="Filter ExpandColumn column">
                    <HeaderStyle Width="20px"></HeaderStyle>
                </ExpandCollapseColumn>
                <Columns>
                    <telerik:GridBoundColumn DataField="CategoryId" DataType="System.Int64" FilterControlAltText="Filter CategoryId column"
                        HeaderText="CategoryId" ReadOnly="True" SortExpression="CategoryId" UniqueName="CategoryId">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="ParentId" DataType="System.Int64" FilterControlAltText="Filter ParentId column"
                        HeaderText="ParentId" SortExpression="ParentId" UniqueName="ParentId">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Title" FilterControlAltText="Filter Title column"
                        HeaderText="Title" SortExpression="Title" UniqueName="Title">
                    </telerik:GridBoundColumn>
                    <telerik:GridCheckBoxColumn DataField="IsLast" DataType="System.Boolean" FilterControlAltText="Filter IsLast column"
                        HeaderText="IsLast" SortExpression="IsLast" UniqueName="IsLast">
                    </telerik:GridCheckBoxColumn>
                </Columns>
                <EditFormSettings>
                    <EditColumn FilterControlAltText="Filter EditCommandColumn column">
                    </EditColumn>
                </EditFormSettings>
            </MasterTableView>
            <FilterMenu EnableImageSprites="False">
            </FilterMenu>
        </telerik:RadGrid>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:TELERIKConnectionString %>"
            SelectCommand="SELECT * FROM [ProductCategories]"></asp:SqlDataSource>
    </telerik:RadAjaxPanel>
    Thanks a lot,
    Timo

  6. Plamen
    Admin
    Plamen avatar
    2758 posts

    Posted 07 Feb 2012 Link to this post

    Hi Timo,

     
    In such scenario where a RadTreeNode is loaded on demand and the control in the node template is added on NodeExpand, such behavior is expected after Postback

    Have you considered adding RadGrid as a Global Template of the nodes and override the nodes where you don't need the Grid with a node text template at run time?

    Hope this will be helpful.

    All the best,
    Plamen Zdravkov
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  7. Timo
    Timo avatar
    5 posts
    Member since:
    Oct 2012

    Posted 07 Feb 2012 Link to this post

    Hi,

    No, I didn't try this.
    Meanwhile I found an article that ajax is not working with some controls like treeview and gridview.
    Here is the link: http://telerikajax.blogspot.com/ .

    What do you know about this?

    Thanks,
    Timo

  8. Plamen
    Admin
    Plamen avatar
    2758 posts

    Posted 09 Feb 2012 Link to this post

    Hello Timo,

     
    This article is based on our documentation and especially on this help topic.

    Regards,
    Plamen Zdravkov
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  9. Aya
    Aya avatar
    1 posts
    Member since:
    Sep 2016

    Posted 17 Nov 2016 Link to this post

    I have problem 

    I make user controll for upload file by "AsyncFileUpload"

    when write that my user controller disappear:

    <asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server">
                            <Scripts>
                                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js"></asp:ScriptReference>
                                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js"></asp:ScriptReference>
                                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js">
                        </asp:ScriptReference>
                            </Scripts>
                        </asp:ScriptManagerProxy>

    it is need to comment third reference but in case it is commented download file not finish. any help?

Back to Top