RadDock command toolbar

5 posts, 0 answers
  1. Lars
    Lars avatar
    8 posts
    Member since:
    Nov 2011

    Posted 21 Mar 2012 Link to this post

    Hello,

    I have a set of RadDock's with 3 commands; edit, close and minimize/maximize.
    I use a custom headertemplate for the docks, the toolbar renders as clickable icons below my headertemplate.
    I would like to change this toolbar to be a dropdown menu (just a square arrow, clicking it brings up the three options in the toolbar)... in the very right of the dock header but I'm not sure how I would achieve this.

    Any suggestion/approach on how this can be achieved is greatly appreciated! :)

    Thanks,
    Lars
  2. Slav
    Admin
    Slav avatar
    1355 posts

    Posted 23 Mar 2012 Link to this post

    Hi Lars,

    You can use the RadContextMenu control in combination with the client-side API of RadDock in order to display a dropdown menu that will include options for managing the dock control. I have attached a sample page that demonstrates the suggested implementation. You can use it as a reference for incorporating this feature into your actual project.

    All the best,
    Slav
    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Lars
    Lars avatar
    8 posts
    Member since:
    Nov 2011

    Posted 27 Mar 2012 Link to this post

    Hello Slav,

    Thank you for your example, I was able to produce the menu from your example, but I seem to have a problem keeping the menu visible :)
    When activating it, it disappears after 1-2 seconds.

    My raddocks are generated by code so the command are added like this:
                DockCommand customCommand = new DockCommand();
                customCommand.Name = "Custom";
                customCommand.Text = "Chart";
                customCommand.OnClientCommand = "DockCustomCommand";
                dock.Commands.Add(customCommand);

    Context Menu:
        <telerik:RadContextMenu ID="CommandsMenu" runat="server" OnClientHiding="ContextMenuHiding"
                OnClientItemClicked="OnClientItemClicked">
                <Items>
                    <telerik:RadMenuItem Text="Close" Value="Close" />
                    <telerik:RadMenuItem Text="Expand/Collapse" Value="ExpandCollapse" />
                </Items>
            </telerik:RadContextMenu>

    I use a global to keep track of the currently active raddock, I have even tried to hard code this but it still disappears.

    Any ideas ? :)

    Lars
  5. Slav
    Admin
    Slav avatar
    1355 posts

    Posted 29 Mar 2012 Link to this post

    Hello Lars,

    Note that in the provided example I am using a global JavaScript variable in order to stop the hiding of the RadContextMenu when the control is displayed via the custom command of RadDock. I have added comments, explaining its use and I have updated the sample according to your description. Please find it attached to this post and use it as base for your future development.

    Greetings,
    Slav
    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.
  6. Lars
    Lars avatar
    8 posts
    Member since:
    Nov 2011

    Posted 13 Apr 2012 Link to this post

    Thanks Slav,

    I got this to work eventually :) since my raddock's was in a updatepanel, the activeDock was lost when ms ajax partial postback's were made. This kept the menubar to hide instantly even in the last example.

    I saved the currentDock in a hidden and restored in in pageLoad clientside event.

    Lars

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