I am finding some strange behavior with the PopupControlExtender when it is located inside an UpdatePanel. The events raised by the children inside the popup are not being fired. In the example I have pasted below, when I click "Add Employee", I want the AddEmployee_Click event to fire; but it does not -- UNLESS I remove the outer UpdatePanel surrounding the entire html block (as shown below). However, I want to repeate this block of code repeatedly (in a user control) and would prefer the entire thing is not completely sent back to the server. Does the popup control not support being inside of a UpdatePanel?
Here is the HTML code:
<asp:UpdatePanel ID="MainUpdatePanel" runat="server" ChildrenAsTriggers="true">
<ContentTemplate>
<table border="0">
<tr>
<td>
<asp:ListBox ID="MainEmployeeList" runat="server" SelectionMode="multiple" Rows="1">
<asp:ListItem Value="10" Text="1name0" />
</asp:ListBox >
</td>
<td>
<asp:LinkButton ID="AddEmployee" runat="server" Text="Add" OnClientClick="return false;" /> |
<asp:LinkButton ID="RemoveEmployee" runat="server" Text="Remove Selected" OnClick="RemoveEmployee_Click" /> |
<asp:LinkButton ID="ViewEmployee" runat="server" Text="View Details" OnClientClick="return false" />
</td>
</tr>
</table>
<asp:Panel ID="EmployeeContainer" runat="server" class="modalPopup">
<asp:UpdatePanel ID="employeePanel" runat="server" ChildrenAsTriggers="true" >
<ContentTemplate>
<table>
<tr>
<td>Branch:</td>
<td>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<asp:DropDownList ID="BranchList" runat="server" AutoPostBack="true" OnSelectedIndexChanged="BranchList_SelectedIndexChanged">
<asp:ListItem Value="1" Text="This Branch" />
<asp:ListItem Value="2" Text="Branch 2" />
<asp:ListItem Value="3" Text="Branch 3" />
</asp:DropDownList>
</td>
<td>
<asp:UpdateProgress id="progress" runat="server" DisplayAfter="0">
<ProgressTemplate>
Loading...
</ProgressTemplate>
</asp:UpdateProgress>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td></td>
<td><asp:ListBox ID="AddEmployeeList" runat="server" SelectionMode="multiple" Rows="15" /></td>
</tr>
<tr>
<td></td>
<td><asp:Button ID="AddEmployeeAction" runat="server" Text="Add" OnClick="AddEmployeeAction_Click" />
<asp:Button ID="CancelEmployeeAction" runat="server" Text="Cancel (does not work)" OnClientClick="$object('ModalDialog_AddEmployee').hidePopup();" /></td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<cc1:PopupControlExtender ID="ModalDialog" Position="Right" runat="server" OffsetX="5"
TargetControlID="AddEmployee" PopupControlID="EmployeeContainer" />
</ContentTemplate>
</asp:UpdatePanel> And here is the code behind:
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
RenderList("1", false);
ViewEmployee.OnClientClick = string.Format("openEmployeeView({0});", MainEmployeeList.ClientID);
}
}
protected void BranchList_SelectedIndexChanged(object sender, EventArgs e)
{
RenderList(BranchList.SelectedValue, true);
}
private void RenderList(string branch, bool showModal)
{
AddEmployeeList.Items.Clear();
for (int i = 0; i < 100; i++)
{
ListItem item = new ListItem(string.Format("{0}name{1}", branch, i.ToString()), branch + i.ToString());
if (!MainEmployeeList.Items.Contains(item))
AddEmployeeList.Items.Add(item);
}
// on a modal branch refresh, we need to leave the modal open
//if (showModal)
// ModalDialog.Show();
}
protected void RemoveEmployee_Click(object sender, EventArgs e)
{
// TODO: on remove of employee, need to refresh the hidden list
// if this employee belongs to the selected branch
if (null != MainEmployeeList.Items && MainEmployeeList.Items.Count > 0)
{
for (int i = 0; i < MainEmployeeList.Items.Count; i++)
{
if (MainEmployeeList.Items[i].Selected)
{
MainEmployeeList.Items.RemoveAt(i);
i--;
}
}
}
MainEmployeeList.Rows = MainEmployeeList.Items.Count;
}
protected void AddEmployeeAction_Click(object sender, EventArgs e)
{
if (null != AddEmployeeList.Items && AddEmployeeList.Items.Count > 0)
{
for (int i = 0; i < AddEmployeeList.Items.Count; i++)
{
if (AddEmployeeList.Items[i].Selected)
{
MainEmployeeList.Items.Add(AddEmployeeList.Items[i]);
AddEmployeeList.Items.RemoveAt(i);
i--;
}
}
}
MainEmployeeList.Rows = MainEmployeeList.Items.Count;
//ModalDialog.Commit("");
//ModalDialog.Hide();
} hi