The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>) error

Question

The code is supposed to work but it is giving me this error.. the disassembly says this "AjaxControlToolkit.ExtenderControlBase.OnLoad(System.EventArgs)"

 var timeoutID;

    function delayedAlert() {
        document.getElementById('<%= Label3.ClientID %>').style.display = 'inherit';
            timeoutID = window.setTimeout(labelhide, 3000);
    }

    function labelhide() {
        document.getElementById('<%= Label3.ClientID %>').style.display = 'none';
    }

textbox

 <asp:Button ID="Button1" runat="server"  Onclick = "Button1_Click" 
            OnClientClick = "javascript:delayedAlert(); return SubmitForm();" 
            Text="Submit" Width="98px"/>

label

<asp:Label ID="Label3" runat="server" Text="Entry Successful!" Visible="False" ForeColor="Lime"  ></asp:Label>

possible duplicate of stackoverflow.com/questions/4995274/… — Johnv2020
@user2484066 please use the word "believe" for ideas that you can not be sure and you accept it or not. Here we have the "I know that is inside UpdatePanel, or I know that is not, or I know that is inside the header not inside an UpdatePanel" — Aristos
@user2484066 Ok, to solve it, use a literal control and render there the id, or the full javascript, (and remove the <%= %>). Header did not like them. — Aristos

Aristos Aristos · Accepted Answer · 2013-06-18T21:51:02

If for a moment forget the reason that cause the error, the results are that the page complain that can not render it because is found the <%= %> that is a direct render of string to the page.

One solution is to use a Literal control and render there on code behind what we like.

For example:

function delayedAlert() {
    document.getElementById('<asp:Literal runat="server" id="txtTheId" EnableViewState="false" />').style.display = 'inherit';
        timeoutID = window.setTimeout(labelhide, 3000);
}

and on code behind

txtTheId.Text = Label3.ClientID.ToString();

Of course this is only the idea to bypass the error, you can render the full javascript on code behind, you register the script or you can just render the id as variable.

For example:

<asp:Literal runat="server" id="txtTheId" EnableViewState="false" />    
var timeoutID;

function delayedAlert() {
    document.getElementById(Label3ID).style.display = 'inherit';
        timeoutID = window.setTimeout(labelhide, 3000);
}

function labelhide() {
    document.getElementById(Label3ID).style.display = 'none';
}

and on code behind you have

txtTheId.Text = "var Label3ID='" + Label3.ClientID + "';";

The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>) error

1 Answers