This example is most related with control are added inside of the grid view and also add checkboxlist control inside of the ModelPopup.
CSS
.modalBackground {
FILTER: alpha(opacity=70); BACKGROUND-COLOR: #fff; opacity: 0.7px
}
.modalPopup {
BORDER-BOTTOM: #ccc 3px solid; BORDER-LEFT: #ccc 3px solid; PADDING-BOTTOM: 5px; BACKGROUND-COLOR: #fff; PADDING-LEFT: 5px; PADDING-RIGHT: 5px; BORDER-TOP: #ccc 3px solid; BORDER-RIGHT: #ccc 3px solid; PADDING-TOP: 5px;
}
ASPX
<asp:Button ID="btnFade" runat="server" Text="" visible="true" Width="0"/>
<asp:ModalPopupExtender
BackgroundCssClass="modalBackground"
DropShadow="true"
CancelControlID="btnCancel"
runat="server"
PopupControlID="pnlModelPopup"
id="ModalPopupExtender1"
TargetControlID="btnFade">
</asp:ModalPopupExtender>
<asp:Panel ID="pnlModelPopup" runat="server" CssClass="modalPopup" style="display:none;">
<table >
<tr>
<td>Add / Modify Competencies<br /><br /> </td>
</tr>
<tr>
<td>
<div style="height:200px; border-style:solid; border-width:thin; overflow: auto; width:100%;" runat="server">
<asp:CheckBoxList ID="chklstCompetencies" runat="server" RepeatColumns="0" >
</asp:CheckBoxList>
</div>
</td>
</tr>
<tr>
<td>
<asp:Button ID="btnSave" runat="server" Text="Save" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
</td>
</tr>
</table>
</asp:Panel>
In Codebehind any event if you want to fire for this ModelPopup then use this.
' show the modal popup
popupLink_ModalPopupExtender.Show()
If you need to use Save button with some process in Code behind following property need to be deleted from the asp:ModalPopupExtender
OkControlID="btnOk"
