Wednesday, March 28, 2012

multiple updatepanels, AsyncPostbackTrigger fails when referenced from more then 1 panel

Im using the latest Beta1, both core and CTP and toolkit, none of the old dll's exist on the system

Im not sure if the following issue is by design or if its a bug,


I have 3 updatepanels on the page, call them p1, p2 and p3 to make it easy to understand
first 2 panels contain a gridview, and a few other controls, p3 contains a couple of dropdowns and a linkbutton (lnk_insert)
when lnk_insert is clicked a new row gets added to gridview in p2 and the updatepanel forp2 contains the following trigger

<Triggers>
<asp:AsyncPostbackTrigger ControlID="lnk_insert" EventName="Click" />
</Triggers
the codebehind takes care of the database stuff and rebinds grid in p2, the page displays correctly and the trigger works fine so far, p2 gets updated
now the trouble - p1 contains a grid as well, whose data depends on grid in P2 (some summary info), the data gets prepared & returned correctly, (verified via debug) and is bound to grid via gridviewXXX.Databind,
p1 updatepanel contains the same

<Triggers>
<asp:AsyncPostbackTrigger ControlID="lnk_insert" EventName="Click" />
</Triggers
referencing the same link button, howeverp1does not update its contents,
different render modes in panel, and forced update of p1 via codebehind didnt help

no error messages come up, no javascript errors in browser either

which makes me think, is it possibly to reference the same control from 2 different updatepanels via asynctrigger ? or is one just overwriting the hooks to the other and thats why one of them doesnt trigger the refresh,

any tips ? thanks in advance

hello.

triggers can be associated with several panels. the following sample demonstrates that:

<%@. Page Language="C#" %
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
<script runat="server"
</script
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server" id="manager" />
<asp:UpdatePanel runat="server" ID="panel1" UpdateMode="Conditional">
<ContentTemplate>
<span>UpdatePanel 1: <%=DateTime.Now.ToString( ) %></span>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="bt" EventName="Click" />
</Triggers>
</asp:UpdatePanel>

<asp:UpdatePanel runat="server" ID="panel2" UpdateMode="Conditional">
<ContentTemplate>
<span>UpdatePanel 2: <%=DateTime.Now.ToString( ) %></span>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="bt" EventName="Click" />
</Triggers>
</asp:UpdatePanel>

<asp:UpdatePanel runat="server" ID="panel3" UpdateMode="Conditional" ChildrenAsTriggers="false">
<ContentTemplate>
<span>UpdatePanel 3: <%=DateTime.Now.ToString( ) %></span>
<asp:LinkButton runat="server" ID="bt" Text="Refresh" />
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>

can you build a small sample that reproduces the problem you're having?


Thanks for the prompt response and code sample, I figured out the problem, (I glued my code into your sample app , which helped locate the problem - it was my fault)

one of the databind's was pointing to the wrong grid - the 3 updatepanels work together as expected and have 2 triggers each

very nice, the attached is the full page, - certainly it wont run without the codebehind, but thats quite lengthy

bottom line multiple updatepanel can have multiple triggers even if (some) of the triggers reference the same control - works fine

<Triggers>

<asp:AsyncPostBackTriggerControlID="bt"EventName="Click"/>

<asp:AsyncPostBackTriggerControlID="gv_group"EventName="SelectedIndexChanged"/>

</Triggers>

<%@.PageLanguage="vb"AutoEventWireup="false"CodeBehind="3updatepanels.aspx.vb"Inherits="schedule._3updatepanels"StylesheetTheme="Default" %>

<%@.RegisterSrc="../controls/nav_main.ascx"TagName="nav_main"TagPrefix="uc1" %>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headrunat="server">

<title>Untitled Page</title>

</head>

<body>

<formid="form1"runat="server">

<asp:ScriptManagerrunat="server"id="manager"/>

<uc1:nav_mainID="Nav_main1"runat="server"/>

<divclass="filter">

<tableborder=1cellspacing=1cellpadding=1width=100%align=center>

<tr>

<td><h2>Groups</h2></td>

<td>Group Name

<asp:TextBoxID="txt_groupname"runat="server"></asp:TextBox></td>

<td>Contains Resource

<asp:DropDownListID="dd_resource"runat="server"AppendDataBoundItems=TrueDataSourceID="dsrc_resourcenames"DataTextField="name"DataValueField="pk_resource">

<asp:ListItemText="All"Value="0"></asp:ListItem>

</asp:DropDownList></td>

<td> Total Items =

<asp:LabelID="lbl_numItems"runat="server"></asp:Label></td>

<td>

<asp:ImageButtonID="btn_refresh"runat="server"ImageUrl="~/images/loader_36.gif"/></td>

</tr>

</table>

</div>

<asp:UpdatePanelrunat="server"ID="panel1"UpdateMode="Conditional">

<ContentTemplate>

<span>UpdatePanel 1: <%=DateTime.Now.ToString( ) %></span>

<asp:GridViewID="gv_group"runat="server"AutoGenerateColumns="False"DataKeyNames="pk_groupname"

DataSourceID="ds_groups"SkinID="BlueSky"AllowSorting=True>

<Columns>

<asp:CommandFieldShowSelectButton="True"/>

<asp:BoundFieldDataField="name"HeaderText="Group Name"SortExpression="name"/>

<asp:BoundFieldDataField="NumItems"HeaderText="Number of Resources"ReadOnly="True"SortExpression="NumItems"ItemStyle-HorizontalAlign=Center/>

<asp:CommandFieldShowDeleteButton=TrueButtonType=ImageDeleteImageUrl="~/images/cancel.gif"ShowEditButton=TrueEditImageUrl="~/images/edit.gif"CancelImageUrl="~/images/cancel.gif"UpdateImageUrl="~/images/confirm_16.gif"/>

</Columns>

</asp:GridView>

</ContentTemplate>

<Triggers>

<asp:AsyncPostBackTriggerControlID="bt"EventName="Click"/>

<asp:AsyncPostBackTriggerControlID="gv_GroupResources"EventName="RowCommand"/>

</Triggers>

</asp:UpdatePanel>

<tablewidth="100%"cellpadding="0"cellspacing="1"bgcolor="gainsboro">

<tr>

<tdbgcolor="whitesmoke"height="25"><imgid="plusminus"src="../images/plus.gif"align="absMiddle"/>

<b>Add New Group :

<asp:TextBoxID="txt_insertname"runat="server"></asp:TextBox>

<asp:LinkButtonID="btn_insert"runat="server">Insert</asp:LinkButton>

</b>

<asp:LabelID="lbl_msg"runat="server"EnableViewState="False"ForeColor="Red"></asp:Label>

</td>

</tr>

</table>

<asp:ObjectDataSourceID="ds_groups"runat="server"DeleteMethod="Delete"InsertMethod="Insert"

SelectMethod="GetDataByWhere"TypeName="schedule.MainTableAdapters.T_GroupNameTableAdapter"

UpdateMethod="Update">

<DeleteParameters>

<asp:ParameterName="pk_groupname"Type="Int32"/>

</DeleteParameters>

<UpdateParameters>

<asp:ParameterName="pk_groupname"Type="Int32"/>

<asp:ParameterName="name"Type="String"/>

</UpdateParameters>

<InsertParameters>

<asp:ParameterName="name"Type="String"/>

<asp:ParameterDirection="InputOutput"Name="pk_groupname"Type="Object"/>

</InsertParameters>

<SelectParameters>

<asp:ParameterName="WhereCondition"Type=string/>

<asp:ParameterDefaultValue="[name]"Name="OrderByExpression"Type="String"/>

</SelectParameters>

</asp:ObjectDataSource>

<asp:SqlDataSourceID="dsrc_resourcenames"runat="server"CacheDuration="120"ConnectionString="<%$ ConnectionStrings:schedule.My.MySettings.conn_Schedule %>"

EnableCaching="True"SelectCommand="SELECT [pk_resource], [name] FROM [T_Resource] ORDER BY [name]">

</asp:SqlDataSource>

<br/>

<tablewidth="100%"cellpadding="0"cellspacing="1"bgcolor="gainsboro">

<tr>

<tdbgcolor="whitesmoke"height="25"><imgid="Img1"src="../images/plus.gif"align="absMiddle"/>

<b>Resources Part of This Group :</b>

</td>

</tr>

</table>

<asp:UpdatePanelrunat="server"ID="panel2"UpdateMode="Conditional">

<ContentTemplate>

<span>UpdatePanel 2: <%=DateTime.Now.ToString( ) %></span>

<asp:GridViewID="gv_GroupResources"runat="server"AutoGenerateColumns="False"

DataSourceID="dsrc_groupresources"SkinID=BlueSkyDataKeyNames="pk_group2resource">

<EmptyDataTemplate>

<h3>None.</h3>

</EmptyDataTemplate>

<Columns>

<asp:CommandFieldShowDeleteButton="True"DeleteText="Remove"/>

<asp:BoundFieldDataField="name"HeaderText="Name"SortExpression="name"/>

<asp:TemplateFieldHeaderText="Location"SortExpression="fk_location">

<ItemTemplate>

<%#lookup.L_Location(Eval("fk_location") - 1)("name").ToString%>

</ItemTemplate>

</asp:TemplateField>

<asp:TemplateFieldHeaderText="OutputType"SortExpression="fk_outputType">

<ItemTemplate>

<imgborder=0src='../images/<%#lookup.Outputtype(Eval("fk_outputtype")-1)("icon").ToString%>'align=absbottom/>

<%#lookup.Outputtype.Item(eval("fk_outputtype")-1)("outputtype").ToString %>

</ItemTemplate>

</asp:TemplateField>

<asp:TemplateFieldHeaderText="Status"SortExpression="fk_status">

<ItemTemplate>

<imgborder=0src='<%#GetResourceStatus(Eval("fk_status"), "icon")%>'align=absbottom/>

<%#GetResourceStatus(Eval("fk_status"),"name")%>

</ItemTemplate>

</asp:TemplateField>

<asp:TemplateFieldHeaderText="Type"SortExpression="fk_type">

<ItemTemplate>

<imgborder=0src='<%# getResourceType(Eval("fk_type"),"icon") %>'align=absbottom/>

<%# getResourceType(Eval("fk_type"),"name") %>

</ItemTemplate>

</asp:TemplateField>

</Columns>

</asp:GridView>

</ContentTemplate>

<Triggers>

<asp:AsyncPostBackTriggerControlID="bt"EventName="Click"/>

<asp:AsyncPostBackTriggerControlID="gv_group"EventName="SelectedIndexChanged"/>

</Triggers>

</asp:UpdatePanel>

<asp:ObjectDataSourceID="dsrc_groupresources"runat="server"DeleteMethod="Resource_DeleteFromGroupbyPK"

SelectMethod="GetData"

TypeName="schedule.MainTableAdapters.Resource_SelectGroupbyGroupPKTableAdapter">

<DeleteParameters>

<asp:ParameterName="pk_group2resource"Type="Int32"/>

</DeleteParameters>

<SelectParameters>

<asp:ControlParameterControlID="gv_group"Name="pk_group"PropertyName="SelectedValue"

Type="Int32"/>

</SelectParameters>

</asp:ObjectDataSource>

<br/>

<tablewidth="100%"cellpadding="0"cellspacing="1"bgcolor="gainsboro">

<tr>

<tdbgcolor="whitesmoke"height="25"><imgid="Img2"src="../images/plus.gif"align="absMiddle"/>

<b>Add Resource to this Group :</b></td>

</tr>

<tr>

<td>

<divid="divAdd"style="DISPLAY:inline;">

<asp:UpdatePanelrunat="server"ID="panel3"UpdateMode="Conditional"ChildrenAsTriggers="false">

<ContentTemplate>

<span>UpdatePanel 3: <%=DateTime.Now.ToString( ) %></span>

Filter Location :<asp:DropDownListID="dd_add_location"runat="server"AutoPostBack=trueAppendDataBoundItems=trueOnSelectedIndexChanged="dd_add_location_SelectedIndexChanged">

<asp:ListItemText="All"Value="0"></asp:ListItem>

</asp:DropDownList>

Filter OutputType :

<asp:DropDownListID="dd_add_outputtype"runat="server"AutoPostBack=trueAppendDataBoundItems=trueOnSelectedIndexChanged="dd_add_outputtype_SelectedIndexChanged">

<asp:ListItemText="All"Value="0"></asp:ListItem>

</asp:DropDownList>

<br/>

Resource Name :

<asp:DropDownListID="dd_add_resource"runat="server"DataSourceID="dsrc_filter_resources"DataTextField="name"DataValueField="pk_resource">

</asp:DropDownList>

<asp:LinkButtonID="btn_add_resource"runat="server"OnClick="btn_add_resource_Click">Add to Group</asp:LinkButton>

<asp:LabelID="lbl_msg2"runat="server"EnableViewState="False"ForeColor="Red"></asp:Label>

<asp:LinkButtonrunat="server"ID="bt"Text="Refresh"OnClick="bt_Click"/>

</ContentTemplate>

</asp:UpdatePanel>

</div></td>

</tr>

</table>

<asp:SqlDataSourceID="dsrc_filter_resources"runat="server"ConnectionString="<%$ ConnectionStrings:schedule.My.MySettings.conn_Schedule %>"

DataSourceMode="DataReader"SelectCommand="SELECT [pk_resource], [name] FROM [T_Resource] ORDER BY [name]">

</asp:SqlDataSource>

</form>

</body>

</html>


When you have multiple UpdatePanels having the same Trigger, all of the update panels will update, but is the processing really async or not? I am asking as I need to have one trigger ('search button') which triggers updating multiple UpdatePanels, AND I would like to detect when each of the UpdatePanels has been updated so I can indicate this outside of the individual UpdatePanels (each UpdatePanel has an associated 'tab' where an animated image displays while the request is running). The PageRequestManager (and it's endRequest) does not seem to help as it will only fire once (with an array of the names of all of the updated UpdatePanels available). I would like a way to trigger separate 'requests' (and react to the ending of each one separately). Thoughts?
hello.
nop. they're all updated udring the same postback. that's why you're getting the results you describe.

No comments:

Post a Comment