Question

我有以下ajax，当运行时更改我的模态体内div的内容。这在第一次运行时有效，但如果模型关闭，则在重新加载模态时使用新数据。它仍然显示以前的数据集，如何在关闭时清除模态内容，因此当ajax运行时，它可以填充模态。

HTML

<div id="existingrequesthover" class="col-xs-11 outer colorhover" style="border:0px solid">
<div class="vcenter">
    <form id="getDataForm" action="/Home/Index" method="get" role="form">
        <label for="platform" class="control-label">Enter Code, IMEI or Phone Number</label><br />
        <div class="col-xs-11 col-sm-offset-1">
            <div class="inner-addon left-addon">
                <i class="glyphicon glyphicon-qrcode"></i>
                <input style="max-width:450px;" id="filtername" name="filtername" type="text" class="form-control" value="" placeholder="Please Enter Code" data-toggle="popover" data-original-title="Enter Code, IMEI or Phone Number" />
            </div>
        </div>
    </form>
</div>

Jquery的

$("#btnGetData").on("click",function () {
    console.log("Click Detected")
    $.ajax({
        type: "GET",
        url: "/Home/AjaxGetDataForCode",
        data: $('#getDataForm').serialize(),
        datatype: "html",
        success: function (data) {
            console.log("Succes!");
            var $detailDiv = $('#superdatadivthing');
            $detailDiv.replaceWith(data);
        },
        error: function () {
            console.log("Error!");
        },
        complete: function () {

            $('#basicModal2').modal('show');
            console.log("Complete Ajax!");
        }
    });
});

模态

<div class="modal fade" id="basicModal2" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
<div class="modal-dialog modal-dialog-center5">
    <div class="modal-content">

        <div class="modal-header">
            <button id="btnclosemodal" type="button" class="close" data-dismiss="modal" aria-hidden="true"><p style="font-size: 40px;">&times;</p></button>
            <h4 class="modal-title" id="myModalLabel">Summary:</h4>
        </div>
        <div class="modal-body">
            <div id="superdatadivthing">
                <!--data goes here-->
            </div>
            <div class="form-group">
                <div class="col-xs-offset-2 col-xs-10">
                    <button class="btn btn-success" id="resultsgo">Go!</button>
                </div>
            </div>
        </div>

有人可以建议一种方法吗？

Answer 1

我的猜测是因为你的选择器$('#superdatadivthing');在用$detailDiv.replaceWith(data);

覆盖该div之后无法匹配任何内容

我不知道data是什么，所以我无法确定，但我不知道

$('#superdatadivthing').html(data);

并更改data，因此它只有内部html

或在替换后添加$detailDiv[0].id = 'superdatadivthing';

或在选择器中包含与输出该数据的脚本相同的ID

JQuery Ajax数据仅以模态加载一次

1 个答案: