<script type="text/javascript" src="http://www.schimsky.com/jquery/jquery-3.4.1.min.js"></script>

<script type="text/javascript" src="http://www.schimsky.com/jquery/jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>

<link type="text/css" rel="Stylesheet" href="http://www.schimsky.com/jquery/jquery-ui-1.12.1.custom/jquery-ui.min.css"/> 

 

 Step 1:  Create the button to open the InputBox

        <div>

            <!-- This DropDownList is here for the sole purpose of getting the __doPostback function -->

            <asp:DropDownList  ID="DropDownList1" runat="server" AutoPostBack="True" BackColor="#CC0066"  >  </asp:DropDownList>

            <!-- The cmdInputBox's Click Event Code Behind will run from the __doPostback function in the javascript:closefunction -->

            <asp:Button ID="cmdInputBox" OnClientClick="InputBox('dvInputBox','Enter Something','500','200');return false" runat="server" Text="Show Input Box" />

        </div>

 

  Step 2:   Here’s the div that IS our InputBox

      <!-- Here's our InputBox... -->

        <div id="dvInputBox" style="display:none;background-color:lightblue">

           <asp:Label ID="Label1" runat="server" Text="Enter your last name:"></asp:Label> <asp:TextBox runat="server" id="txtNameLast"></asp:TextBox>

        </div>

 

  Step 3:   Here’s the InputBox function…   Add: open: setTimeout(function () { $("#" + dvID).dialog("close"); }, 2000), to make it a MessageBox

  function InputBox(dvID,sTitle,sWidth,sHeight) {

 

            // ***************

            // NO close 'x'

            // ***************

 

            //**********************************

            // if you want to add the overlay...

            //***************************************************************************************************      

            $('head').append('<style type="text/css">.ui-widget-overlay.ui-front {opacity:.75; }</style>');

            //***************************************************************************************************      

 

 

            $("#" + dvID).dialog({

                title: sTitle,

                buttons: [{ text: "Save", click: function () { $(this).dialog("close"); CloseFunction(); } }, { text: "Cancel", click: function () { $(this).dialog("close"); } }],

                closeOnEscape: false,

                modal: true,

                show: "slideDown",

                hide: 'slideUp',

                width: sWidth,

                height: sHeight,

                appendTo: '#form1'

            }).prev().find(".ui-dialog-titlebar-close").hide();

 

        // End of InputBox Function

 

 

   Step 4:  Here’s the CloseFunction that calls the __doPostBack code behind…

  function CloseFunction() {

             __doPostBack('cmdInputbox', "")

        } //End CloseFunction