Question

我在一个页面上有多个模态，所有模式都有唯一的ID。当用户单击按钮时，它会打开唯一模式。

<button id="<?php echo $removeslash; ?>" class="btn btn-primary open-modal" data-source="output.php"><span class="glyphicon glyphicon-new-window"></span> Open Modal</button>

正如您所看到的那样，modal的主体位于output.php中，这是因为我在output.php中运行一个脚本，该脚本根据单击的按钮创建唯一数据。我试图通过ajax将id="<?php echo $removeslash; ?>"传递给output.php。这是下面的ajax。

<script>
$(document).on("click", ".open-modal", function(e) {
    e.preventDefault();
    $("#modalResult .modal-body").load($(this).data("source"), function(response, status, xhr) {
        if (status == "error") {
            console.log("unable to load content : " + xhr.status);
        } else {
            $("#modalResult").modal("show");
        }

    });
    var mehmeh = $(this).attr('id');
    $.ajax({
        type: "POST",
        url: "output.php",
        data: ({
            'id': mehmeh
        }),

        success: function(msg) {
            alert("Data Saved: " + msg);
        }
    });

});

ajax代码工作正常我认为因为成功函数显示按钮id in。但是当模态加载时，它不会加载。这是output.php文件中的echo代码。

<h1>FooBar: <?php echo $_REQUEST['id']; ?></h1>

我确定它与index.php上的模态加载有关，但ajax将数据提供给output.php，但我无法弄明白。

由于

Answer 1

我设法解决了这个问题，它可能非常草率但是在这里。

<script>
$(document).on("click", ".open-modal", function(e) {
    var id = $(this).data('id');

    e.preventDefault();
    $("#modalResult .modal-body").load($(this).data("source"), function(response, status, xhr) {
        if (status == "error") {
            console.log("unable to load content : " + xhr.status);
        } else {
            $.post("output.php", {
                    id: id
                })
                .done(function(data) {
                    $("#modalResult").modal("show");
                    $('.modal-body').html(data);
                })
        }

    });
});

将ajax var加载到从另一个php页面加载的bootstrap模式中

1 个答案: