In this article I will explain with an example, how to use and dynamically display (show) ASP.Net AJAX ModalPopupExtender Modal Popup without setting its TargetControlID property.
ASP.Net AJAX ModalPopupExtender Modal Popup can be shown using JavaScript using the BehaviorID property and hence it can be shown using any Button without setting the Button’s ID to the TargetControlID property.
Some more articles on ASP.Net AJAX Modal Popup:-
  
 
HTML Markup
First we need to register the AJAX Control Toolkit on the page.
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
 
Below is the ASP.Net AJAX ModalPopupExtender Modal Popup.
<asp:Button ID="btnShow" runat="server" Text="Show Modal Popup" OnClientClick="return ShowModalPopup()" />
<asp:LinkButton ID="lnkDummy" runat="server"></asp:LinkButton>
<cc1:ModalPopupExtender ID="ModalPopupExtender1" BehaviorID="mpe" runat="server"
    PopupControlID="pnlPopup" TargetControlID="lnkDummy" BackgroundCssClass="modalBackground">
</cc1:ModalPopupExtender>
<asp:Panel ID="pnlPopup" runat="server" CssClass="modalPopup" Style="display: none">
    <div class="header">
        Modal Popup
    </div>
    <div class="body">
        This is a Modal Popup.
        <br />
        <asp:Button ID="btnHide" runat="server" Text="Hide Modal Popup" OnClientClick="return HideModalPopup()" />
    </div>
</asp:Panel>
 
You will notice that I have made use of a Hidden LinkButton lnkDummy the reason is that, ASP.Net AJAX ModalPopupExtender requires TargetControlID to be set and since we want to open and close the ASP.Net AJAX ModalPopupExtender Modal Popup from Client Side JavaScript we need to set a hidden control as TargetControlID.
Note: For more details on using the ASP.Net AJAX ModalPopupExtender please refer my article Building Modal Popup using ASP.Net AJAX ModalPopupExtender Control
 
 
 
Display ASP.Net AJAX ModalPopupExtender Modal Popup without setting TargetControlID
ASP.Net AJAX ModalPopupExtender Modal Popup has a property BehaviorID. Using the BehaviorId we can access the ASP.Net AJAX Modal Popup Client Side using the ASP.Net ScriptManager $find function.
Once the JavaScript instance of ASP.Net AJAX Modal Popup has been created we can easily show and hide it using the show() and hide() JavaScript methods respectively. Thus now you can open and show the ASP.Net AJAX ModalPopupExtender Modal Popup using any Button without setting the Button’s ID to the TargetControlID property.
<script type="text/javascript">
    function ShowModalPopup() {
        $find("mpe").show();
        return false;
    }
    function HideModalPopup() {
        $find("mpe").hide();
        return false;
    }
</script>
 
Use ASP.Net AJAX ModalPopupExtender Modal Popup without setting TargetControlID
 
 
Demo
View Demo
 
Downloads