PopupControlExtender Control In Ajax

Example:
<form id="form1" runat="server">
 <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
 <h3> Using PopupControlExtender</h3>
 <hr />
 <div>
 <b>Enter Your Favourite Language: </b>
 <asp:TextBox ID="txtLanguage" runat="server"></asp:TextBox>
 <asp:Panel ID="Panel1" runat="server">
 <div style="border: 1px outset white; width: 150px">
 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
 <ContentTemplate>

 <asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged">
 <asp:ListItem Text="Visual C#" />
<asp:ListItem Text="Visual Basic" />
 <asp:ListItem Text="Visual C++" />
 <asp:ListItem Text="Visual J#" />
<asp:ListItem Text="Cancel" Value="" />
</asp:RadioButtonList>
 </ContentTemplate>
 </asp:UpdatePanel>
 </div>
 </asp:Panel>
 <asp:PopupControlExtender ID="PopupControlExtender1" runat="server" TargetControlID="txtLanguage" PopupControlID="Panel1" CommitProperty="value" Position="Bottom" />
 </div>
 </form>

Code View:
protected void RadioButtonList1_SelectedIndexChanged(object sender, EventArgs e)
 {
 if (!string.IsNullOrEmpty(RadioButtonList1.SelectedValue))
 {
 // Popup result is the selected task
 PopupControlExtender1.Commit(RadioButtonList1.SelectedValue);
}
 else
 {
 // Cancel the popup PopupControlExtender1.Cancel();
 }
 // Reset the selected item RadioButtonList1.ClearSelection();
}

Output:-