DropDownList in repeater does asynchronous postback but does not fire SelectedIndexChange event
So, I've run out of all the help I can find on this, but I'm still stumped.
I have a DDL in a relay, I need to send an Async message and update the refreshed panel also within the same relay:
<asp:Repeater ID="rptOverdue" runat="server"
OnItemDataBound="setUpDateActionsSpecial">
<ItemTemplate>
<div class="theActions clearfix overdue edit hiddenrepeater" id='action_<%# Eval("item_id")%>'>
<span class="actionid"><%# Eval("item_id") %></span>
<div class="actiontitle">
<asp:TextBox ID="tbTitle" CssClass="theTitle" runat="server" Text='<%# Eval("item_title") %>' />
</div>
<div class="actionicons">
<a href="#" onclick='cancelUpdateAction(<%# Eval("item_id") %>)'><i class="icon-remove-sign actioniconcancel"></i></a>
<a href="#" onclick='commitUpdateAction(<%# Eval("item_id") %>)'><i class="icon-ok-sign actioniconok"></i></a>
</div>
<div class="actiondate">
<div class="input-append date" id="dp_<%# Eval("item_id") %>" data-date="<%= String.Format("{0:yyyy-MM-dd}", DateTime.Now) %>" data-date-format="yyyy-mm-dd">
<asp:TextBox ID="when2" CssClass="span2 theDuedate" size="16" type="text" name="when" placeholder="Due Date" runat="server" Text='<%# String.Format("{0:yyy-MM-dd}",Eval("item_duedate")) %>' />
<span class="add-on"><i class="icon-th"></i></span>
</div>
</div>
<div class="actionmeta">
<asp:DropDownList ID="ddlUpdateArea" CssClass="ddlUpdateArea" runat="server"></asp:DropDownList>
<asp:UpdatePanel ID="upDdlGoal" runat="server" UpdateMode="always">
<ContentTemplate>
<asp:DropDownList ID="ddlUpdateGoal" CssClass="ddlUpdateGoal" runat="server"></asp:DropDownList>
</ContentTemplate>
<Triggers>
</Triggers>
</asp:UpdatePanel>
<asp:UpdatePanelAnimationExtender ID="ae" runat="server" TargetControlID="upDdlGoal">
<Animations>
<OnUpdating>
<FadeOut Duration=".3" Fps="20" minimumOpacity=".5" />
</OnUpdating>
<OnUpdated>
<sequence>
<FadeIn Duration=".3" Fps="20" minimumOpacity=".5" />
<ScriptAction Script=" $('.goaliconplus').tooltip({ placement: 'top', trigger: 'hover', title: 'Add' });
$('.goaliconeye').tooltip({ placement: 'top', trigger: 'hover', title: 'Edit' });
$('.actioniconlist').tooltip({ placement: 'top', trigger: 'hover', title: 'View list' });
$('.actioniconnote').tooltip({ placement: 'top', trigger: 'hover', title: 'View note' });
$('.actioniconeye').tooltip({ placement: 'top', trigger: 'hover', title: 'Edit' });
$('.actionicondelete').tooltip({ placement: 'top', trigger: 'hover', title: 'Delete' });
$('.actioniconcomplete').tooltip({ placement: 'top', trigger: 'hover', title: 'Complete' });
scrollItemList();" />
</sequence>
</OnUpdated>
</Animations>
</asp:UpdatePanelAnimationExtender>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
I have set up triggers and autorepeats, etc. in the ItemDataBound event for the relay:
protected void setUpDateActionsSpecial(object sender, RepeaterItemEventArgs e)
{
if ((e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem))
{
// Bind DDLs
DropDownList ddlAreas = (DropDownList)e.Item.FindControl("ddlUpdateArea");
DropDownList ddlGoals = (DropDownList)e.Item.FindControl("upDdlGoal").FindControl("ddlUpdateGoal");
UpdatePanel upDdlGoal = (UpdatePanel)e.Item.FindControl("upDdlGoal");
DataRowView drv = e.Item.DataItem as DataRowView;
ddlAreas.DataSource = (DataTable)Session["arealist"]; ;
ddlAreas.DataTextField = "area_title";
ddlAreas.DataValueField = "area_id";
ddlAreas.DataBind();
ddlAreas.SelectedValue = drv["goal_area"].ToString();
// Register Area DDL for postback
ddlAreas.SelectedIndexChanged += updateTheGoals;
ddlAreas.AutoPostBack = true;
AsyncPostBackTrigger trigger = new AsyncPostBackTrigger();
trigger.ControlID = ddlAreas.UniqueID;
trigger.EventName = "SelectedIndexChanged";
upDdlGoal.Triggers.Add(trigger);
if (ScriptManager.GetCurrent(Page).IsInAsyncPostBack)
{
triggerInitMethod.Invoke(trigger, null);
}
DataTable goalTable = (DataTable)Session["goallist"];
DataRow[] goalsDR = goalTable.Select("goal_area = " + ddlAreas.SelectedValue);
DataTable goalFiltered = goalTable.Clone();
foreach (DataRow row in goalsDR)
{
goalFiltered.ImportRow(row);
}
goalFiltered.AcceptChanges();
ddlGoals.DataSource = goalFiltered;
ddlGoals.DataTextField = "goal_title";
ddlGoals.DataValueField = "goal_id";
ddlGoals.DataBind();
ddlGoals.SelectedValue = drv["item_goal"].ToString();
litEmptyActionsDate.Visible = false;
}
}
This should be returned asynchronously and the code executed in the updateTheGoals event handler:
protected void updateTheGoals(object sender, EventArgs e)
{
// Bind DDLs
DropDownList ddlAreas = (DropDownList)sender;
UpdatePanel thisUP = (UpdatePanel)ddlAreas.Parent.FindControl("upDdlGoal");
DropDownList ddlGoals = (DropDownList)thisUP.FindControl("ddlUpdateGoal");
DataTable goalTable = (DataTable)Session["goallist"];
DataRow[] goalsDR = goalTable.Select("goal_area = 1024");// + ddlAreas.SelectedValue);
DataTable goalFiltered = goalTable.Clone();
foreach (DataRow row in goalsDR)
{
goalFiltered.ImportRow(row);
}
goalFiltered.AcceptChanges();
ddlGoals.DataSource = goalFiltered;
ddlGoals.DataTextField = "goal_title";
ddlGoals.DataValueField = "goal_id";
ddlGoals.DataBind();
ddlGoals.Items.Insert(0, new ListItem("Choose a Goal", "0"));
ddlGoals.SelectedValue = "Choose a Goal";
thisUP.Update();
}
What actually happens is it seems that the update bar seems to be doing an update (animation runs and finishes), but the actual content of the ddlUpdateGoal dropdown is not changing. It appears to be doing an asynchronous postback, but does not actually fire the SelectedIndexChanged event handler to change the content of the update pane.
Has anyone encountered this problem before? (All help was gratefully received before I got my monitor thru the office!)
Thanks Ben
source to share
No one has answered this question yet
Check out similar questions: