Dynamically created Docks and ClientCommands - Bug??

2 posts, 0 answers
  1. Joe Labate
    Joe Labate avatar
    2 posts
    Member since:
    Apr 2010

    Posted 03 Jun 2010 Link to this post

    I have a page that creates docks programmatically and assigns a custom command to each dock. The custom command uses the OnClientCommand property to set the client-side function that executes when the command is clicked.

    The first problem I am having, is that the client-side function is being automatically executed when the docks are loaded. I need the function to be executed only when the user clicks the custom command button.

    The second problem is that when I click the custom command button, I get the following script run-time error within the script manager WebResource.axd:

    Message: Object doesn't support this property or method
    Line: 6
    Char: 29366
    Code: 0

    I am running Telerik RadControls version 2010-1-415. I am using the 3.5 framework .dll inside a 3.5 framework web application using Visual Studio 2010 Professional.

    Here is the Web Form code:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RadDockTest.aspx.cs" Inherits="TelerikTest.RadDockTest" %> 
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
     
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head runat="server">  
        <title></title>  
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <telerik:RadScriptManager ID="RadScriptManager1" Runat="server">  
        </telerik:RadScriptManager> 
     
        <div> 
            <script language="javascript" type="text/javascript">  
            function CustomCommandClick(dockID) {  
                alert("Custom command clicked for dock #" + dockID);  
            }  
            </script> 
              
            <asp:UpdatePanel ID="upRadDocks" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">  
                <Triggers> 
                    <asp:AsyncPostBackTrigger ControlID="btnLoadDocks" EventName="Click" /> 
                </Triggers> 
                <ContentTemplate> 
                    <asp:Button ID="btnLoadDocks" runat="server" Text="Load Docks" OnClick="btnLoadDocks_Click" /> 
     
                    <telerik:RadDockLayout ID="rdlRadDocks" runat="server">  
                        <telerik:RadDockZone ID="rdzDynamicDocks" runat="server" Width="800" MinHeight="200">  
                        </telerik:RadDockZone> 
                    </telerik:RadDockLayout> 
                </ContentTemplate> 
            </asp:UpdatePanel> 
        </div> 
        </form> 
    </body> 
    </html> 
     


    Here is the class code:


    using System;  
    using System.Collections.Generic;  
    using System.Linq;  
    using System.Web;  
    using System.Web.UI;  
    using System.Web.UI.WebControls;  
    using Telerik.Web.UI;  
     
    namespace TelerikTest  
    {  
        public partial class RadDockTest : System.Web.UI.Page  
        {  
            protected void Page_Load(object sender, EventArgs e)  
            {  
     
            }  
              
            /// <summary>  
            /// Creates a new rad dock  
            /// </summary>  
            /// <param name="id">The dock ID</param>  
            /// <returns>A RadDock control</returns>  
            private RadDock CreateRadDock(int id)  
            {  
                //Create the new dock  
                RadDock     dock                    = new RadDock();  
                dock.DockMode                       = DockMode.Docked;  
                dock.UniqueName                     = "rd" + id.ToString();  
                dock.ID                             = dock.UniqueName;  
                dock.Width                          = Unit.Pixel(800);  
     
                //Clear dock commands  
                dock.Commands.Clear();  
     
                //Add the dock commands  
                DockCommand command                 = new DockCommand();  
                command.Name                        = "Custom Command";  
                command.Text                        = "Custom Command";  
                command.OnClientCommand             = "CustomCommandClick('" + dock.UniqueName + "');";  
                dock.Commands.Add(command);  
     
                return dock;  
            }  
     
            /// <summary>  
            /// Load Docks button click event  
            /// </summary>  
            /// <param name="sender"></param>  
            /// <param name="e"></param>  
            protected void btnLoadDocks_Click(object sender, EventArgs e)  
            {  
                //Load the docks  
                for(int i = 0; i <= 4; i++)  
                {  
                    //Create a new dock  
                    RadDock dock = this.CreateRadDock(i);  
     
                    //Add the new dock to the dock zone  
                    this.rdzDynamicDocks.Controls.Add(dock);  
                }  
            }  
        }  
  2. Joe Labate
    Joe Labate avatar
    2 posts
    Member since:
    Apr 2010

    Posted 07 Jun 2010 Link to this post

    This issue is resolved. I made the mistake of assuming that the OnClientCommand property was simply a call to a javascript function that you specify. In fact, this is a client-side delegate that requires the signature of a delegate.

    Changing the signature of the client-side function to "function CustomCommandClick(dock, sender)" and the value of the OnClientCommand property to "CustomCommandClick" fixed the issue.

    Works like a charm now.

     

  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top