Disabled menu item still enables onclick event

[Tri Nguyen]

Hello,
Could you show me or point me to the direction to figure out how I can actually disable the "onclick" event on the disable menu item? Please look at this code segment. Even when the "ADD-PROFILE-LIST" menu item is disabled, when clicking on it, the "ShowEditForm" script still activates, which pop-ups a window.

Thanks in advance.

Tri
P.S: I don't have a way to attach the .zip file with all the code files.

<telerik:RadMenu ID="rmnSideBar" runat="server" Flow="Vertical" Skin="Default" EnableEmbeddedSkins="True"
    EnableSelection="false" Style="z-index: 3900;">
    <Items>
        <telerik:RadMenuItem runat="server" HoveredImageUrl="~/Images/Buttons/btn_Functions_glow.png"
            ImageUrl="~/Images/Buttons/btn_Functions.png" Width="26px">
            <Items>
                <telerik:RadMenuItem runat="server" ImageUrl="~/Images/24/report_add_24.png" Text="Add to Profile List"
                    Visible="true" onclick="return ShowEditForm('PopWin1', 0, 520, 370);" Enabled="false"
                    Value="ADD-PROFILE-LIST">
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadMenuItem>
    </Items>
</telerik:RadMenu>

[Shinu]

Hi Tri,

You can invoke the ShowEditForm method in the OnClientItemClicked event of the RadMenu which wont fire if the RadMenuItem is disabled. Please check the following code.

ASPX:

<telerik:RadMenu ID="rmnSideBar" runat="server" Flow="Vertical"  OnClientItemClicked="itemclick" Skin="Default" EnableEmbeddedSkins="True"
    EnableSelection="false" Style="z-index: 3900;">
    <Items>
        <telerik:RadMenuItem runat="server" HoveredImageUrl="~/Images/SD.png" ImageUrl="~/Images/aud.jpg"
            Width="26px">
            <Items>
                <telerik:RadMenuItem runat="server" ImageUrl="~/Images/Paste.jpg" Text="Add to Profile List"
                    Visible="true" Enabled="false" Value="ADD-PROFILE-LIST">
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadMenuItem>
    </Items>
</telerik:RadMenu>

Another option is you can check the enabled status of the RadMenuItem and if it is enabled then execute the corresponding code. Please have a look into the sample code I tried.

ASPX:

<telerik:RadMenu ID="rmnSideBar" runat="server" Flow="Vertical" Skin="Default" EnableEmbeddedSkins="True"
    EnableSelection="false" Style="z-index: 3900;">
    <Items>
        <telerik:RadMenuItem runat="server" HoveredImageUrl="~/Images/SD.png" ImageUrl="~/Images/aud.jpg"
            Width="26px">
            <Items>
                <telerik:RadMenuItem runat="server" ImageUrl="~/Images/Paste.jpg" Text="Add to Profile List"
                    Visible="true" onclick="itemclick()" Enabled="true" Value="ADD-PROFILE-LIST">
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadMenuItem>
    </Items>
</telerik:RadMenu>

JavaScript:

<script type="text/javascript">
    function itemclick() {
        var menu = $find('<%=rmnSideBar.ClientID %>');
        if (menu.findItemByText("Add to Profile List").get_enabled() == true) { //checking whether the node is enabled
            alert("Executing JavaScript Code");
            //your code when item is enabled.
        }
        else {
            alert("Item is Disabled");
        }
    }
</script>

Thanks,
Shinu.