如何在asp.net中打开模式poppup窗口?

时间:2014-04-16 05:53:37

标签: c# javascript asp.net

这是我的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>

在这种情况下,只需点击按钮页面即可刷新

3 个答案:

答案 0 :(得分:0)

您是否尝试过以下链接: 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>

答案 1 :(得分:0)

尝试此操作来限制回发:

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

答案 2 :(得分:0)

我建议添加文档准备语句

<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"/>