首页 > 解决方案 > 当我试图在 jquery 中将数据附加到其主体时,模态弹出窗口正在关闭

问题描述

嗨朋友们正在尝试将一些数据附加到我的模态弹出窗口中,该数据来自单击某个按钮时的局部视图,单击“下一步”按钮时应将另一个问题附加到弹出窗口中,并且在用户手动关闭它之前不应关闭它,这是一个简单的测试进行应用程序

@model List<Vulpith.Models.View.Test.AdaptabilityViewModel><div>
@foreach (var a in Model)
{
    <div>@a.QDescription</div>
}
<button type="button" class="btn btn-default" onclick="StartTest()">Next</button>

我将上述内容附加到以下关于ajax提交的模型

<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">

    <!-- Modal content-->
    <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">
            <div id="appendquestion">

            </div>

        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal" onclick="StartTest()">Start Test</button>

        </div>
    </div>

</div>

以下是控制器

    public ActionResult _QuestionView()
    {

        return PartialView(new AdaptabilityTestTrans().Get());
    }

我的ajax提交是

<script>
function StartTest() {
    $.ajax({
        url: $("baseUrl").html() + "Test/_QuestionView",
        type: "POST",
        success: function (data) {
            debugger;
            $('#appendquestion').html(data);
            $('#myModal').modal(show);



        },
        error: function (data) {
            $('#loading').hide();
        }
    });
}

标签: javascriptjqueryasp.net-mvc-5

解决方案


data-dismiss="modal"从中删除modal-footer。当您StartTest()通过单击开始按钮调用时,data-dismiss会触发并关闭模式。

<div class="modal-footer">
     <button type="button" class="btn btn-default"onclick="StartTest()">Start Test</button>
</div>

推荐阅读