I am trying to assign updateprogess css values with javscript but the clientID for the control is fetching wrong clientid.. the code of the asp.net is
<div style="display: Block; clear: left;" runat="server" id="DivLike">
<asp:UpdatePanel ID="UpdatePanelLike" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div style="position: relative;">
<div style="position: absolute; top: 0px; left: 0px;">
<asp:LinkButton ID="LinkButtonLike" runat="server" CommandName="<%#Eval("Like_Command") %>" Font-Size="XX-Small" OnCommand="LinkButton2_Command" Text="<%#Eval("Like_Command")%>">
</asp:LinkButton>
</div>
<div class="popupstyle" style="position:absolute; top:0px; left:0px; display:none;" id="DivChapters" runat="server">
<asp:UpdatePanel ID="UpdatePanelLinkActivity" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div>
Select Chapter:
<asp:DropDownList ID="DropDownListChapters" runat="server" AutoPostBack="true">
</asp:DropDownList>
</div>
<div>
Select Topic:
<asp:DropDownList ID="DropDownListTopics" runat="server">
</asp:DropDownList>
</div>
<div>
<asp:LinkButton ID="LinkButtonAddLink" runat="server" OnCommand="LinkButtonAddLink_Command" Text="Add" CssClass="UtilityClass">
</asp:LinkButton>
</div>
<asp:UpdateProgress ID="UpdateProgressLinkActivity" runat="server" AssociatedUpdatePanelID="UpdatePanelLinkActivity" DynamicLayout="True">
<ProgressTemplate>
<div style=" position:absolute; top:50%; left:50%; background-color:white;" id="divLoading">
<img src="Images/loading25.gif" alt="Loading..." style="" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="LinkButtonAddLink" EventName="Command" />
</Triggers>
</asp:UpdatePanel>
</div>
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="LinkButtonLike" EventName="Command" />
</Triggers>
</asp:UpdatePanel>
</div>
the JavaScript code is this:
var updateProgress = document.getElementById('<%=UpdateProgressLinkActivity.ClientID%>');
updateProgress.style.position = 'absolute';
updateProgress.style.width = '250px';
updateProgress.style.height = '100px';
updateProgress.style.top = '0px';
updateProgress.style.left = '0px';
I have nested two updatepanels. Can this be the issue?