Forums Retired Products and Controls
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Roger Bogh
1414
Would like to 'grey' out Disabled Menu Items...
posted

A nice to have, but the customer would be very appreciative if he/she knows that they cannot click on a menu item because of a security model.

I am using a WebMenu.

Each item has an Enabled property.  If I set the Enabled property of a menu item to false than the highlight does not appear and the customer cannot click on it.  Very good so far.

However, it would be nice to visually inform the customer (maybe through 'greying out' the menu item text) that - Yes we do know that you cannot select that menu item.  Right now our customer base will probably think it is a bug.

 

Parents
No Data
Reply
  • 28464
    posted

    Hello Roger,

    I believe in this situation you can take advantage of our DisabledStyle style class - you can sent font face, size and color (for example to gray) for all disabled items on the menu. In the example below, I have set gray to be the default style for disabled items:

    <ignav:UltraWebMenu ID="UltraWebMenu1" runat="server" JavaScriptFilename="" JavaScriptFileNameCommon=""
            LeafItemImageUrl="" ParentItemImageUrl="" StyleSetName="">
            <IslandStyle BackColor="LightGray" BorderStyle="Outset" BorderWidth="1px" Cursor="Default">
            </IslandStyle>
            <HoverItemStyle BackColor="DarkBlue" Cursor="Default" ForeColor="White">
            </HoverItemStyle>
            <Images>
                <SubMenuImage Url="ig_menuTri.gif" />
            </Images>
            <ItemStyle Cursor="Default" />
            <Items>
                <ignav:Item Text="Top Item">
                    <Items>
                        <ignav:Item Text="Sub Menu Item">
                        </ignav:Item>
                        <ignav:Item Enabled="False" Text="Sub Menu Item">
                            <Styles ForeColor="#666633">
                            </Styles>
                        </ignav:Item>
                        <ignav:Item Text="Sub Menu Item">
                        </ignav:Item>
                    </Items>
                </ignav:Item>
                <ignav:Item Text="Top Item">
                    <Items>
                        <ignav:Item Text="Sub Menu Item">
                        </ignav:Item>
                        <ignav:Item Text="Sub Menu Item">
                        </ignav:Item>
                        <ignav:Item Text="Sub Menu Item">
                        </ignav:Item>
                    </Items>
                </ignav:Item>
            </Items>
            <DisabledStyle Font-Names="MS Sans Serif" Font-Size="8pt" ForeColor="Gray">
            </DisabledStyle>
            <Levels>
                <ignav:Level Index="0" />
                <ignav:Level Index="1" />
            </Levels>
            <SeparatorStyle BackgroundImage="ig_menuSep.gif" CssClass="SeparatorClass" CustomRules="background-repeat:repeat-x; " />
            <ExpandEffects ShadowColor="LightGray"></ExpandEffects>
            <MenuClientSideEvents InitializeMenu="" ItemChecked="" ItemClick="" SubMenuDisplay=""
                ItemHover=""></MenuClientSideEvents>
        </ignav:UltraWebMenu>
     

    Hope this helps. 

Children