I need help with my AJAX Update Panel. It either doesn't display my data or does a whole page postback. I have a gridview that displays a list of jquery sliders on the left hand side of my page. Each slider as POSTID that I need to use to fetch the details of the post. I'm using a linkbutton within my gridview as the trigger. On the right hand side of the page is where I wand to display my details, right next to the slider. I've tried registering the toolkitscriptmanager and I've tried to manually calling the update panel from the backend after clicking on the linkbutton but I can't get it to consistently work.
asp code:
<form id="fixturesSelect" runat="server">
<Ajax:ToolkitScriptManager runat="server" ID="ScriptManager1" />
<%--Images Displayed in Table below--%>
<asp:Table ID="tblDropdowns" runat="server" Width="85%" HorizontalAlign="Center">
<asp:TableRow><asp:TableCell><p> </p></asp:TableCell></asp:TableRow>
<asp:TableRow>
<asp:TableCell>
<div class="fixturesFormDrop">
<label for="recipient">CATEGORY</label>
<asp:DropDownList ID="categoryList0"
runat="server"
Height="20px"
Width="181px">
</asp:DropDownList>
<Ajax:CascadingDropDown ID="cddCategories"
TargetControlID="categoryList0"
PromptText="Select Category"
PromptValue="0"
ServicePath="~/ServiceCS.asmx"
ServiceMethod="GetCategories"
runat="server"
Category="CategoryID"
LoadingText="Loading..." />
</div>
</asp:TableCell>
<%--SubCategory List Populated by Category Selected in code behind--%>
<asp:TableCell>
<div class="fixturesFormDrop">
<label for="recipient">SUBCATEGORY</label>
<asp:DropDownList ID="subcategoryList0"
runat="server"
DataTextField="CategoryName"
DataValueField="CategoryID"
Height="20px"
OnSelectedIndexChanged="subcategoryList_SelectedIndexChanged"
Width="180px"
AutoPostBack="True">
</asp:DropDownList>
<Ajax:CascadingDropDown ID="cddSubCategories"
TargetControlID="subcategoryList0"
ServicePath="~/ServiceCS.asmx"
ServiceMethod="GetSubCategories"
runat="server"
Category="CategoryID"
ParentControlID="categoryList0"
LoadingText="Loading..." />
</div>
</asp:TableCell>
<asp:TableCell>
<div class="fixturesFormDrop">
<label for="recipient"> TAGS </label>
<asp:TextBox ID="tags0" runat="server" ReadOnly="true" Width="250" Height="18px" />
<Ajax:PopupControlExtender ID="PopupControlExtender111" runat="server" TargetControlID="tags0" PopupControlID="Panel1" Position="Bottom" />
<input type="hidden" name="hidVal" id="hidVal" runat="server" />
<asp:Panel ID="Panel1" runat="server">
<asp:CheckBoxList ID="chkList" runat="server" Height="20" onclick="CheckItem(this)" />
</asp:Panel>
</div>
</asp:TableCell><asp:TableCell>
<div class="fixturesTextInput">
<label for="recipient">JOB NUMBER </label>
<asp:TextBox ID="jobNumber0" runat="server" Height="18px" Width="90" />
</div>
</asp:TableCell><asp:TableCell HorizontalAlign="Left">
<asp:Button ID="btnSubmit" runat="server" Text="Search" OnClick="btnSubmit_OnClick" />
<asp:Button ID="btnClear" runat="server" Text="Clear Search" OnClick="btnClear_OnClick" />
</asp:TableCell>
</asp:TableRow>
<asp:TableRow ID="trBlank" runat="server">
<asp:TableCell ColumnSpan="5" runat="server"> </asp:TableCell>
</asp:TableRow>
<asp:TableRow ID="trlblMessage" runat="server">
<asp:TableCell ColumnSpan="5" runat="server">
<h2 id="h2_lblMessage" align="center"><asp:Label ID="lblMessage" runat="server" visible="false" ForeColor="#660000" Font-Size="15px" /></h2>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
<div id="wrapper">
<div id="mainContent">
<asp:UpdatePanel ID="panelimages" runat="server">
<ContentTemplate>
<asp:GridView ID="gvPosts" runat="server" AutoGenerateColumns="false" Visible="true" ShowHeader="false" GridLines="None" Width="940" Height="470" HorizontalAlign="Center"
OnRowDataBound="gvPosts_OnRowDataBound" DataKeyNames="PostID" BorderStyle="Solid">
<Columns>
<asp:TemplateField HeaderImageUrl="Images" ItemStyle-HorizontalAlign="Left">
<ItemTemplate>
<%--<asp:Label ID="lblimage1" runat="server" Visible="false" Text='<%# Eval("Img1") %>' />--%>
<div class="slider" id="slideshow<%# Container.DataItemIndex %>">
<asp:ListView ID="lvPics" runat="server" AutoGenerateColumns="false" Visible="true" ShowHeader="false">
<LayoutTemplate>
<ul class="bjqs">
<asp:PlaceHolder ID="itemPlaceholder" runat="server" />
<%--<div class="img-overlay">
<h3 align="center"><asp:Label ID="lblOverlaytitle" runat="server" Text='<%# Eval("txtJobName") %>' ForeColor="White" /></h3>
</div>--%>
</ul>
</LayoutTemplate>
<ItemTemplate>
<li>
<asp:LinkButton ID="lbImageDetails" runat="server" OnClick="lbImageDetails_OnClick">
<img src='<%# Eval("flImageThumb") %>' alt="no image" width="940" height="450" title='<%# Eval("txtJobName") %>' />
</asp:LinkButton>
</li>
</ItemTemplate>
<%--<EmptyDataTemplate>
<p>Sorry, no images have been uploaded for this post yet.</p>
</EmptyDataTemplate>--%>
</asp:ListView>
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<section id="flDetailsSection">
<asp:UpdatePanel ID="updatepanel2" runat="server">
<ContentTemplate>
<h2 id="H1" class="flDetailsHeader"><asp:Label ID="lblProjectName" runat="server" /></h2>
<div class="flDetails" id="flDetailsOrg">
<asp:Table ID="tblOrganizationInfo" runat="server" Visible="false">
<asp:TableRow><asp:TableCell><h3>Organization</h3></asp:TableCell></asp:TableRow>
<asp:TableRow><asp:TableCell> Category: <span><asp:Label ID="lblCategory" runat="server" /></span></asp:TableCell></asp:TableRow>
<asp:TableRow><asp:TableCell> Subcategory: <span><asp:Label ID="lblSubCat" runat="server" /></span></asp:TableCell></asp:TableRow>
<asp:TableRow><asp:TableCell ID="tcTags" runat="server"> Tags: <asp:HyperLink ID="hlTags" runat="server" /></asp:TableCell></asp:TableRow>
</asp:Table>
</div>
<h3><asp:Label ID="lblLaborDetailsHeader" runat="server" Text="Labor Details" CssClass="flDetails" Font-Size="24px" Visible="false" /></h3><br />
<asp:UpdatePanel ID="upLaborDetails" runat="server" Visible="false">
<ContentTemplate>
<asp:Panel ID="pHeader" runat="server">
<h3><asp:Image ID="Image1" runat="server" />
<asp:Label ID="lblText" runat="server" Font-Size="16px" ForeColor="Maroon" /></h3>
</asp:Panel>
<asp:Panel ID="pBody" runat="server" CssClass="cpBody">
<asp:GridView ID="gvLaborDetails" runat="server" ShowFooter="true" AutoGenerateColumns="false"
OnRowDataBound="gvLaborDetails_RowDataBound" cellspacing="10" BorderStyle="Solid" GridLines="Both" Width="100%">
<Columns>
<asp:BoundField HeaderText="Department" DataField="txtDepartmentDescription" />
<asp:BoundField HeaderText="Work Order Desc" DataField="txtWorkOrderDescription" FooterText="Total Hours" FooterStyle-Font-Bold="true" FooterStyle-HorizontalAlign="Right" ItemStyle-HorizontalAlign="Center" />
<asp:TemplateField HeaderText="Budget Hours" HeaderStyle-Wrap="true" ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="60px" FooterStyle-HorizontalAlign="Center" FooterStyle-Font-Bold="true" >
<ItemTemplate>
<%# DataBinder.Eval(Container.DataItem, "sWorkOrderHoursBudget") %>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="ProjSum" runat="server" />
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Actual Hours" HeaderStyle-Wrap="true" ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="60px" FooterStyle-HorizontalAlign="Center" FooterStyle-Font-Bold="true">
<ItemTemplate>
<%# DataBinder.Eval(Container.DataItem, "sWorkOrderHoursActual") %>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="ActualSum" runat="server" />
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</asp:Panel>
<ajax:CollapsiblePanelExtender ID="CollapsiblePanelExtender1"
runat="server"
TargetControlID="pBody"
CollapseControlID="pHeader"
ExpandControlID="pHeader"
Collapsed="true"
TextLabelID="lblText"
ImageControlID="Image1"
CollapsedText="Click to Show Labor Details.."
ExpandedText="Click to Hide Labor Details.."
ExpandedImage="~/images/collapse.jpg"
CollapsedImage="~/images/expand.jpg"
CollapsedSize="0">
</ajax:CollapsiblePanelExtender>
</ContentTemplate>
</asp:UpdatePanel>
<div class="flDetails" id="flDetailsProject">
<asp:Table ID="tblProjDetails" runat="server" CellPadding="1" Visible="false">
<asp:TableRow><asp:TableCell><h3>Project Details</h3></asp:TableCell></asp:TableRow>
<asp:TableRow><asp:TableCell> Job Number: <b><asp:Label ID="lblJobNum" runat="server" /></b></asp:TableCell></asp:TableRow>
<asp:TableRow><asp:TableCell> Job Location: <asp:Label ID="lblJobCity" runat="server" /></asp:TableCell></asp:TableRow>
<asp:TableRow><asp:TableCell> General Contractor: <asp:Label ID="lblGC" runat="server" /></asp:TableCell></asp:TableRow>
<asp:TableRow><asp:TableCell> Architect: <asp:Label ID="lblArhitect" runat="server" /></asp:TableCell></asp:TableRow>
<%--<asp:TableRow><asp:TableCell> Job Close Date: <asp:Label ID="lblJobCloseDate" runat="server" /></asp:TableCell></asp:TableRow>--%>
</asp:Table>
</div>
<div class="flDetails" id="flDetailsComments">
<h3><asp:Label ID="lblCommentslbl" runat="server" Text="Comments:" CssClass="flDetails" Visible="false" /></h3>
<asp:Label ID="lblComments" runat="server" CssClass="flComments" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</section>
</div>
</form>
------------------------------
.cs code
protected void Page_Load(object sender, EventArgs e)
{
ScriptManager1.RegisterAsyncPostBackControl(gvPosts);
}
protected void lbImageDetails_OnClick(object sender, EventArgs e)
{
tblOrganizationInfo.Visible = true;
lblLaborDetailsHeader.Visible = true;
tblProjDetails.Visible = true;
lblCommentslbl.Visible = true;
upLaborDetails.Visible = true;
BindJobDetails();
BindLaborDetails();
GetCurrentTags();
updatepanel2.Update();
}
also tried:
protected void Page_Load(object sender, EventArgs e)
{
this.RegisterPostBackControl();
}
private void RegisterPostBackControl()
{
foreach (GridViewRow row in gvPosts.Rows)
{
LinkButton lnkFull = row.FindControl("lbImageDetails") as LinkButton;
string templb = Convert.ToString(lnkFull);
if (!string.IsNullOrEmpty(templb))
{
ScriptManager.GetCurrent(this).RegisterPostBackControl(lnkFull);
}
}
}