asp.net C＃中的Bootstrap模式弹出问题＃

Question

我按下按钮点击这个弹出窗口：

     <li>
                <a href="#" data-toggle="modal" data-target="#myModal"><span class="glyphicon glyphicon-user"></span> <asp:Label runat="server" ID="lblUserName"></asp:Label></a>
             </li>

<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">
        <p>Some text in the modal.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

我不知道为什么会这样。我甚至无法接近。

我希望它是这样的：

Answer 1

您必须在关闭按钮事件上编写以下代码：

$('#myModal').modal('hide');
$('.modal-backdrop').removeClass('modal-backdrop');
$('.fade').removeClass('fade');
$('.in').removeClass('in');
$('html, body').css({
    'overflow': 'auto',
    'height': 'auto'
});

请使用以下代码触发按钮事件：

$。AJAX（{

        url: '/test/test?id=' + id,
        type: "Post",
        async: false,
        dataType: "html",
        contentType: "application/json;charset=utf-8",
        success: function (result) {  
           //Your div name where you want to show model popup data                 
            $("#YourResultDivName").empty();
            $("#YourResultDivName").html(result);

           //your button click event trigger from here for open model popup
           $("#btnhdnModelPopup").trigger('click'); 

        }
    });

检查以下HTML代码以获取模型弹出窗口：

<form id="ModelPopupForm" class="form-horizontal">
    <button type="button" id="btnhdnModelPopup" style="display: none;" class="btn btn-info btn-lg" data-toggle="modal" data-target="#divModelPopup"></button>
    <div class="modal fade" id="divModelPopup" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog modal-95" role="document">
            <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" id="myModalLabel">Model Title</h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-xs-12">
                           Your Data
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" id="btnClose" class="btn btn-default btn-sm" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>
</form>

它会完美运作!!

Answer 2

您拥有的代码可以在我的机器上运行！您提供的代码之外必然存在其他问题。将此代码粘贴到一个空白的.html文档中并运行它，然后再回到它与您之间的区别。

silent Push Notification