Show/Hide a Module via Javascript

5 posts, 1 answers
  1. Steve
    Steve avatar
    14 posts
    Member since:
    Oct 2006

    Posted 05 Mar 2010 Link to this post

    We'd have a system custom module for the editor that would contain large save/close buttons (not toolbar sizes) we'd like to show only when the editor is in full screen.  I can detect the full screen toggling, but need a way to show/hide the module via javascript.  Basically the same functionality that the Module Manager button does without the user clicking on that button and selecting/deselecting our module.

    Any way to do this?
  2.
  3. Answer
    Rumen
    Admin
    Rumen avatar
    13804 posts

    Posted 05 Mar 2010 Link to this post

    Hi,

    Here is an example demonstrating how to toggle the visibility of the RadEditor modules with javascript:

    <telerik:RadEditor ID="RadEditor1" runat="server">
        <Tools>
            <telerik:EditorToolGroup>
                <telerik:EditorTool Name="RadEditorStatistics" />
                <telerik:EditorTool Name="RadEditorHtmlInspector" />
            </telerik:EditorToolGroup>
        </Tools>
        <Modules>
            <telerik:EditorModule Name="RadEditorDomInspector" />
            <telerik:EditorModule Name="RadEditorHtmlInspector" />
            <telerik:EditorModule Name="RadEditorNodeInspector" />
            <telerik:EditorModule Name="RadEditorStatistics" />
        </Modules>
    </telerik:RadEditor> 
    <script type="text/javascript">
        Telerik.Web.UI.Editor.CommandList["RadEditorStatistics"] = function(commandName, editor, args) {
            ToggleModuleVisibility("RadEditorStatistics", editor);
        };
     
        Telerik.Web.UI.Editor.CommandList["RadEditorHtmlInspector"] = function(commandName, editor, args) {
            ToggleModuleVisibility("RadEditorHtmlInspector", editor);
        };
     
        function ToggleModuleVisibility(moduleName, editor) {
            var moduleManager = editor.get_modulesManager();
            if (!moduleManager) return false;
     
            var module = moduleManager.getModuleByName(moduleName);
            if (module) {
                module.toggleVisibility();
            }
     
            return false;
        } 
    </script>

    Greetings,
    Rumen
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  5. Steve
    Steve avatar
    14 posts
    Member since:
    Oct 2006

    Posted 05 Mar 2010 Link to this post

    Need to check for the full screen button in OnClientCommandExecuting instead of OnClientCommandExecuted, but that works perfectly. 

    Thanks.

  7. Trevor
    Trevor avatar
    18 posts
    Member since:
    Mar 2009

    Posted 14 Apr 2011 Link to this post

    This works greate, however I would like to know how to Hide the module without toggling.
    Can I test if the module is visible first? if so then I will toggle.

    Regards,

    Trevor
  8.
  9. Rumen
    Admin
    Rumen avatar
    13804 posts

    Posted 18 Apr 2011 Link to this post

    Hi Todd,

    You can use the get_visible() and set_visible(boolean) methods of the module object:

    var module = moduleManager.getModuleByName(moduleName);
    if (module) {
        //module.toggleVisibility();
        if (module.get_visible()) { module.set_visible(false); }
    }



    Kind regards,
    Rumen
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Back to Top