Bootstrap模式弹出窗口不起作用

时间:2018-02-12 05:06:54

标签: javascript jquery asp.net twitter-bootstrap

我有以下代码在带有母版页的webforms应用程序中显示引导模式弹出窗口。这在一个小的单页测试站点上工作正常。但是,当我将它移动到我的实际网站时,弹出窗口不会显示出来。调试没有javascript错误。我已经移动了,javascript代码到母版页的头部以及模式弹出窗格到母版页的主体。弹出窗口仍然无法显示!

aspx页面:

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
  <style>
    .vertical-alignment-helper {
      display: table;
      height: 100%;
      width: 100%;
    }

    .vertical-align-center {
      /* To center vertically */
      display: table-cell;
      vertical-align: middle;
    }
  </style>
  <script type="text/javascript">
    function ShowPopup() {
      $("#btnShowPopup").click();
    }

    function btnRedirect_Click() {
      window.location.replace("Redirected.aspx?
        FirstName = John & LastName = Velu ");
      }
  </script>
  <br/>
  <br/>
  <div class="row">
    <div class="col-md-4">
      <asp:Button runat="server" Text="Display Popup" OnClick="OnClick" />
    </div>
  </div>

  <div class="modal fade" id="myModal" data-backdrop="static" data- keyboard="false">
    <div class="vertical-alignment-helper">
      <div class="modal-dialog vertical-align-center">
        <div class="modal-content ">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" style="color: white">
              Test</h4>
          </div>
          <div class="modal-body">
            <asp:Label ID="lblMessage" runat="server" Text="Testing..." />
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-primary" id="btnRedirect" OnClick="Javascript:btnRedirect_Click();">
                        Redirect</button>
            <button type="button" class="btn btn-default" data- dismiss="modal">
                        Close</button>
          </div>
        </div>
      </div>
    </div>
  </div>
  <button type="button" style="display: none;" id="btnShowPopup" class="btn 
      btn-primary btn-lg" data-toggle="modal" data-target="#myModal">       
     </button>

</asp:Content>

代码隐藏

 protected void btnLogin_Click(object sender, EventArgs e)
 {
    Response.Redirect("Redirected.aspx");
 }

 protected void OnClick(object sender, EventArgs e)
 {
   ClientScript.RegisterStartupScript(this.GetType(), "alert", 
   "ShowPopup();", true);            
   return;
 }

0 个答案:

没有答案