ContentPlaceHolderID added as prefix to my form fields

Question

I have a asp:Content tag added to my aspx page.

<asp:Content ID="Step1Content" ContentPlaceHolderID="MainContent" Runat="Server">

and I have a javascript like below,

   function switchAllMenu() {
            var ids = new Array('divOut', 'divQOR', 'divPop', 'divRD', 'divCst', 'divRep', 'divCnt');
            var i, el, newObj, el1;
            if (document.getElementById('aSwitchAllMenu').value == "Expand All") {
                document.getElementById('aSwitchAllMenu').value = "Collapse All";
                for (i = 0; i < ids.length; i++) {
                    el = document.getElementById(ids[i]);
                    newObj = ids[i].replace("div", "li");
                    el1 = document.getElementById(newObj);
                    el.style.display = '';
                    el1.className = 'active';
                }
            }
            else {
                document.getElementById('aSwitchAllMenu').value = "Expand All";
                for (i = 0; i < ids.length; i++) {
                    el = document.getElementById(ids[i]);
                    newObj = ids[i].replace("div", "li");
                    el1 = document.getElementById(newObj);
                    el.style.display = 'none';
                    el1.className = '';
                }

when i click the expandAll or collapseall the corresponding Div has to expand and collapse. But since the content place holder is added to the page, it prefixes to the field names and my JavaScript wouldnt work. what change i should make in this javascript so my expand collapse works.

My field names looks like this, MainContent_divOut, MainContent_divQOR...should i chnge the var id's with "MainContent_" as prefix. However even that didnt work excpet for the 1st field 'divOut'.

Answer 1

You can fix that in the web.config depending on your asp.net version, if you are using 4.0, you can set it inline , <asp:TextBox runat="server" ClientIDMode="static" id="txt1" />

this will prevent the prefix to be added to your control id.

more detail here

Answer 2

Use <%=Element.ClientID%> For Eg. use <%=divOut.ClientID%> to get client id of any server side control on the page.