如何在asp.net中打开模式弹出窗口？

Question

这是我的Java脚本代码：

    <script> 
    $('#<%= btnOpen.ClientID %>').click(function (e) { 
    e.preventDefault();
    $('#content').modal({ onOpen: function (dialog) { 
     dialog.overlay.fadeIn('slow', function () { 
      dialog.data.hide();
      dialog.container.fadeIn('slow', function () { 
      dialog.data.slideDown('slow'); 
     }); 
    }); 
   }, 
   onClose: function (dialog) { 
    dialog.data.fadeOut('slow', function () { 
     dialog.container.slideUp('slow', function () { 
      dialog.overlay.fadeOut('slow', function () { 
       $.modal.close(); // must call this! 
       }); 
      }); 
     }); 
    }  
  }); 
 </script> 

还有我的按钮

  <td> 
   <asp:Button ID="btnOpen" runat="server" Text="Open" ClientIDMode="Static" /> 
  </td>

在这种情况下，仅单击按钮的页面将刷新

Answer 1

您是否尝试过此链接： http : //www.codeproject.com/Articles/34996/ASP-NET-AJAX-Control-Toolkit-ModalPopupExtender-Co

<asp:scriptmanager id="ScriptManager1" runat="server">
</asp:scriptmanager>

<asp:button id="Button1" runat="server" text="Button" />

<cc1:modalpopupextender id="ModalPopupExtender1" runat="server"


cancelcontrolid="btnCancel" okcontrolid="btnOkay" 
targetcontrolid="Button1" popupcontrolid="Panel1" 
popupdraghandlecontrolid="PopupHeader" drag="true" 
backgroundcssclass="ModalPopupBG">
</cc1:modalpopupextender>

<asp:panel id="Panel1" style="display: none" runat="server">
<div class="HellowWorldPopup">
            <div class="PopupHeader" id="PopupHeader">Header</div>
            <div class="PopupBody">
                <p>This is a simple modal dialog</p>
            </div>
            <div class="Controls">
                <input id="btnOkay" type="button" value="Done" />
                <input id="btnCancel" type="button" value="Cancel" />
    </div>
    </div>

Answer 2

试试这个来限制回发：

<asp:Button ID="btnOpen" runat="server" Text="Open" ClientIDMode="Static" OnClientClick="return false;" />

Answer 3

我建议添加一个文档准备好的声明

<script>
$(document).ready(function(e){
    //rest of your script here
});
</script>

还要提到的另一件事是， 如果您知道按钮的特定ID就是这样引用它的

$('#btnOpen').click(function(e){
    e.preventDefault();
    //rest of your script here
});

最终结果：

<script>
    $(document).ready(function(){
        $('#btnOpen').click(function(e){
            e.preventDefault();

            if(!HttpContext.Current.Session["UserID"]){
                //userID exists show form code
                //rest of original code here
            } else {
                //do something else or nothing
            }
        });
    });
</script>

<asp:Button ID="btnOpen" runat="server" Text="Open" ClientIDMode="Static"/>