Events not fired when TreeView referenced in RadAjaxManager

6 posts, 0 answers
  1. Mark
    Mark avatar
    10 posts
    Member since:
    May 2013

    Posted 30 May 2013 Link to this post

    I have downloaded and tested the demo from here:

    http://demos.telerik.com/aspnet-ajax/treeview/examples/programming/addremovedisable/defaultcs.aspx

    This allows click events for adding and deleting nodes in a treeview, and for the treeview to be updated without screen flicker.

    However, the demo code doesn't work for me.

    For example, if I try to delete a node by clicking on the Delete Node button it doesn't even fire the DeleteButton_Click event.  If I remove the reference to the DeleteButton in the RadAjaxManager, then the event fires, but I then get the screen flicker when the tree is redrawn.

    The code is below:

    <%@ Page Title="" Language="C#" MasterPageFile="~/Site.User.master" EnableViewState="true" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="Test" %>
     
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <%@ Register TagPrefix="asp" Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit"%>
     
    <asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
    </asp:Content>
     
    <asp:Content ID="Content2" EnableViewState="true" ContentPlaceHolderID="MainContent" Runat="Server">
     
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
        <telerik:RadSkinManager ID="QsfSkinManager" runat="server" ShowChooser="true" />
        <telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All" EnableRoundedCorners="false" />
         <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1">
              <AjaxSettings>
                   <telerik:AjaxSetting AjaxControlID="DisableButton">
                        <UpdatedControls>
                             <telerik:AjaxUpdatedControl ControlID="RadTreeView1" LoadingPanelID="RadAjaxLoadingPanel1">
                             </telerik:AjaxUpdatedControl>
                        </UpdatedControls>
                   </telerik:AjaxSetting>
                   <telerik:AjaxSetting AjaxControlID="EnableAllButton">
                        <UpdatedControls>
                             <telerik:AjaxUpdatedControl ControlID="RadTreeView1" LoadingPanelID="RadAjaxLoadingPanel1">
                             </telerik:AjaxUpdatedControl>
                        </UpdatedControls>
                   </telerik:AjaxSetting>
                   <telerik:AjaxSetting AjaxControlID="DeleteButton">
                        <UpdatedControls>
                             <telerik:AjaxUpdatedControl ControlID="RadTreeView1" LoadingPanelID="RadAjaxLoadingPanel1">
                             </telerik:AjaxUpdatedControl>
                        </UpdatedControls>
                   </telerik:AjaxSetting>
                   <telerik:AjaxSetting AjaxControlID="AddButton">
                        <UpdatedControls>
                             <telerik:AjaxUpdatedControl ControlID="RadTreeView1" LoadingPanelID="RadAjaxLoadingPanel1">
                             </telerik:AjaxUpdatedControl>
                        </UpdatedControls>
                   </telerik:AjaxSetting>
              </AjaxSettings>
         </telerik:RadAjaxManager>
         <telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1">
         </telerik:RadAjaxLoadingPanel>
     
              <ul class="qsfexAvailableActions">
                   <li>
                        <asp:Button ID="DisableButton" runat="server" OnClick="DisableButton_Click"
                             ValidationGroup="DisableRequiresSelection" Text="Disable selected node"></asp:Button>
                        <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Select a node first."
                             ControlToValidate="RadTreeView1" Display="Dynamic" ValidationGroup="DisableRequiresSelection"
                             CssClass="validator"></asp:RequiredFieldValidator>
                   </li>
                   <li>
                        <asp:Button ID="EnableAllButton" runat="server" CausesValidation="False"
                             OnClick="EnableAll_Button" Text="Enable all nodes"></asp:Button>
                   </li>
                   <li>
                        <asp:Button ID="DeleteButton" runat="server" OnClick="DeleteButton_Click"
                             ValidationGroup="DeleteRequiresSelection" Text="Delete selected node"></asp:Button>
                        <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="Select a node first."
                             Display="Dynamic" ControlToValidate="RadTreeView1" ValidationGroup="DeleteRequiresSelection"
                             CssClass="validator"></asp:RequiredFieldValidator>
                   </li>
                   <li>
                        <telerik:RadTextBox runat="Server" ID="NodeTextBox" EmptyMessage="Enter node text">
                        </telerik:RadTextBox>
                        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Text is required"
                             Display="Dynamic" ControlToValidate="NodeTextBox" ValidationGroup="TextRequired"
                             CssClass="validator"></asp:RequiredFieldValidator>
                   </li>
                   <li>
                        <asp:Button ID="AddButton" runat="server" OnClick="AddButton_Click" Text="Add new node"></asp:Button>
                   </li>
              </ul>
     
         <telerik:RadTreeView ID="RadTreeView1" runat="server" Height="280px" Width="300px">
         </telerik:RadTreeView>
     
    </asp:Content>

     

    using System;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
     
    public partial class Test : System.Web.UI.Page
    {
        private void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                RadTreeView1.LoadContentFile("tree.xml");
            }
        }
     
        protected void DisableButton_Click(object sender, EventArgs e)
        {
            Page.Validate("DisableRequiresSelection");
            if (Page.IsValid)
            {
                RadTreeView1.SelectedNode.Enabled = false;
                RadTreeView1.SelectedNode.Selected = false;
            }
        }
     
        protected void EnableAll_Button(object sender, EventArgs e)
        {
            foreach (RadTreeNode node in RadTreeView1.GetAllNodes())
            {
                node.Enabled = true;
            }
        }
     
        protected void DeleteButton_Click(object sender, EventArgs e)
        {
            Page.Validate("DeleteRequiresSelection");
            if (Page.IsValid)
            {
                RadTreeView1.SelectedNode.Remove();
            }
        }
     
        protected void AddButton_Click(object sender, EventArgs e)
        {
            Page.Validate("TextRequired");
            if (Page.IsValid)
            {
                IRadTreeNodeContainer target = RadTreeView1;
                if (RadTreeView1.SelectedNode != null)
                {
                    RadTreeView1.SelectedNode.Expanded = true;
                    target = RadTreeView1.SelectedNode;
                }
     
     
                RadTreeNode addedNode = new RadTreeNode(NodeTextBox.Text);
                addedNode.Selected = true;
                target.Nodes.Add(addedNode);
            }
        }
     
    }
  2. Mark
    Mark avatar
    10 posts
    Member since:
    May 2013

    Posted 30 May 2013 Link to this post

    To simplify the testing of this issue, I have stripped the test code down to the basics:

    <%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" EnableViewState="true" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="Test" %>
     
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <%@ Register TagPrefix="asp" Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit"%>
     
    <asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
    </asp:Content>
     
    <asp:Content ID="Content2" EnableViewState="true" ContentPlaceHolderID="MainContent" Runat="Server">
     
        <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
        <telerik:RadSkinManager ID="QsfSkinManager" runat="server" ShowChooser="true" />
        <telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All" EnableRoundedCorners="false" />
     
        <asp:Button ID="DeleteButton" runat="server" OnClick="DeleteButton_Click" Text="Delete selected node"></asp:Button>
     
         <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1">
              <AjaxSettings>
                    <telerik:AjaxSetting AjaxControlID="DeleteButton">
                        <UpdatedControls>
                             <telerik:AjaxUpdatedControl ControlID="RadTreeView1" LoadingPanelID="RadAjaxLoadingPanel1">
                             </telerik:AjaxUpdatedControl>
                        </UpdatedControls>
                   </telerik:AjaxSetting>
              </AjaxSettings>
         </telerik:RadAjaxManager>
     
         <telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1">
         </telerik:RadAjaxLoadingPanel>
     
         <telerik:RadTreeView ID="RadTreeView1" runat="server" Height="280px" Width="300px">
         </telerik:RadTreeView>
     
    </asp:Content>

    and the code behind is:


    using System;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
     
    public partial class Test : System.Web.UI.Page
    {
        private void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                RadTreeView1.LoadContentFile("tree.xml");
            }
        }
     
        protected void DeleteButton_Click(object sender, EventArgs e)
        {
            Page.Validate("DeleteRequiresSelection");
            if (Page.IsValid)
            {
                RadTreeView1.SelectedNode.Remove();
            }
        }
    }

    With the code as above, the deletebutton_click event never gets fired.

    However if I remove the following code from the RadAjaxManager, then the click event gets fired, but it then causes a screen flicker on refresh:

    <telerik:AjaxSetting AjaxControlID="DeleteButton">
         <UpdatedControls>
              <telerik:AjaxUpdatedControl ControlID="RadTreeView1" LoadingPanelID="RadAjaxLoadingPanel1">
              </telerik:AjaxUpdatedControl>
         </UpdatedControls>
    </telerik:AjaxSetting>


    ANY ideas?



  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 04 Jun 2013 Link to this post

    Hello Mark,

    When using master and content page it is recommended that you use the RadAjaxManagerProxy control instead of the RadAjaxManager control as fully explained here. Another approach would also be to us the RadAjaxPanel only on the content page and wrap the button and the treeview control.

    Regards,
    Kate
    Telerik
    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. Mark
    Mark avatar
    10 posts
    Member since:
    May 2013

    Posted 04 Jun 2013 Link to this post

    That seems to help, however I now have the following scenario:

    I have a tree in a div on the left
    I have a grid in a div on the right

    If I have the tree in a radpanel then the grid on the right doesn't draw.  My server side code does get called when the click occurs, so I know the click is happening.

    I have also tried to put every control in the panel, however that then screws up the page layout as both the tree and the grid are in their own independent vertical scrolling divs.  When they are all in the one panel then I lose all ability for those divs to scroll vertically.

    Any ideas?

    Is there any best practice I should follow here for my specific scenario?

    Best regards

    Mark
  6. Mark
    Mark avatar
    10 posts
    Member since:
    May 2013

    Posted 19 Jun 2013 Link to this post

    Bump...

    Anyone?
  7. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 24 Jun 2013 Link to this post

    Hi Mark,

    It seems that the scenario that you describe is very custom one and therefore we would need to inspect it locally. For this purpose I would suggest that you open an official support ticket where you can attach your simplified runnable project so I can run it and investigate the issue locally.

    Regards,
    Kate
    Telerik
    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 the blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017