Controls in a telerik control not accessible from .cs file

Question

Hi,

I am using telerik controls in my c# asp.net project. I am trying to disable a div in a telerik navigation menu from the .cs file. For example:

        if (Emp_Role == "1" || Emp_Role == "5")
        {
            DivLeave.Visible = true;
        }

I try run the project I get this error:

CS0103: The name 'DivLeave' does not exist in the current context

Here is an example of the aspx code

<telerik:RadMenu runat="server" ID="RadMenu1" Skin="Sitefinity"   OnClientItemOpened="itemOpened"
            Width="670px" Height="26px" EnableShadows="true">
            <Items>
                <telerik:RadMenuItem Text="Expenses" PostBack="false">
                    <Items>
                        <telerik:RadMenuItem CssClass="Stores" Width="640px">
                            <ItemTemplate>
                                <div id="DivLeave" class="Wrapper">
                                    <h3>
                                        Expense Management</h3>
                                    </div>

Can anyone help with this? If I place the div outside the telerik control it works fine. This is so frustrating!

Kind regards,

R

Answer 1

First, you have to use a asp.net control ( or at least a control that runs in server ) to be able to access it from code behind. For example.

<asp:Label ID="DivLeave" runat="server"></asp:Label>

Second, to get a control inside a Telerik control you need som special code. In your example, you can do something like this:

 // Find menuitem by css class
 RadMenuItem expenses = RadMenu1.FindItem(i => i.CssClass == "Stores");
 // Find control inside menuitem
 Label label = expenses.FindControl("DivLeave") as Label;
 label.Visible = true;

To learn more: Accessing Controls Inside Templates

Answer 2

Doing it client side will also work and you won't have to make the div become server side. Using jQuery you can have:

if (Emp_Role == "1" || Emp_Role == "5")
{
    Page.ClientScript.RegisterStartupScript(this.Page.GetType(), "show_divleave", "$(function() {   $(\"div[id$='DivLeave']\").each(function(index) { $(this).css(\"display\", \"\"); }); });", true);
}

This assumes those div elements are initially hidden using "display: none;" CSS rule.

Answer 3

@Svendberg

I tried your suggestion as I need to control the control server side. But when I run the solution i.e. the code below:

    RadMenuItem expenses = RadMenu1.FindItemByText("Expenses");
    Label DivLeave = (Label)expenses.FindControl("DivLeave");
    DivLeave.Visible = false;

I get this error:

   {"Object reference not set to an instance of an object."}

Any idea how I can fix this? I am 100% sure the DivLeave is on the page....