Intersoft Support Center

Show/Hide Items

WebExplorerPane gives you flexibility to show and hide ExplorerBar item.

This topic will show you how to show and hide the items in the WebExplorerBar.

To show and hide ExplorerBar items

  1. In WebExplorerBarItem Collection Editor, add 3 more items which are Move, Copy and Rename this file.
  2. Set Visible to false in the property window for those 3 items.



  3. Add 4 HTML buttons and named them "Show All Items", "Hide All Items", "Show Items" and "Hide Items" respectively.
  4. Add the following code in client-side to perform show/hide all items and show/hide several items:
    JavaScript Copy Code
    function ShowAllItems()
    {    
       var expPane = ISGetObject("WebExplorerPane1");    
       var paneFileFolder = expPane.Panes.GetNamedItem("WebExplorerBarFile");    
       paneFileFolder.ShowAllItems();      
       paneFileFolder.AnimateHeight();
    }
                            
    function HideAllItems()
    {    
       var expPane = ISGetObject("WebExplorerPane1");    
       var paneFileFolder = expPane.Panes.GetNamedItem("WebExplorerBarFile");    
       paneFileFolder.HideAllItems();    
       paneFileFolder.AnimateHeight();         
    }
                            
    function ShowItems()
    {    
       var expPane = ISGetObject("WebExplorerPane1");    
       var paneFileFolder = expPane.Panes.GetNamedItem("WebExplorerBarFile");    
       paneFileFolder.ShowItems(["itm_Move", "itm_Copy", "itm_Rename"], true);          
    } 
                            
    function HideItems()
    {    
       var expPane = ISGetObject("WebExplorerPane1");    
       var paneFileFolder = expPane.Panes.GetNamedItem("WebExplorerBarFile");    
       paneFileFolder.HideItems(["itm_Move", "itm_Copy", "itm_Rename"], true);          
    }
    

  5. Invoke ShowAllItems(), HideAllItems(), ShowItems() and HideItems() functions in onclick event respectively like the following:
    JavaScript Copy Code
    <input id="Button1" type="button" value="Show All Items" onclick="ShowAllItems()"/>
    <input id="Button2" type="button" value="Hide All Items" onclick="HideAllItems()"/>
    <input id="Button3" type="button" value="Show Items (Move, Copy, Rename)" onclick="ShowItems()"/>
    <input id="Button4" type="button" value="Hide Items (View, Order, Print)" onclick="HideItems()"/>
    

  6. Run the project. Hence,
    • When you click "Show All Items" button, it will display all the items.
    • When you click "Hide All Items" button, it will hide all the items.
    • When you click "Show Items" button, it will show the items defined in the function, which are Move this file, Copy this file and Rename this file. The rest will be hidden.
    • When you click "Hide Items" button, it will hide the items defined in the function, which are Move this file, Copy this file and Rename this file. The rest will be displayed.
Previous Next