Jquery 引导模式：加载所提供ID的数据

我有一个，可以从不同的超链接启动，每个超链接提供另一个ID

但我想要的是，每次启动模态时，它都会被传递给模态的ID的数据填充。以下是（简化的）代码（请参见代码中的注释以了解解释）：

让我们假设有一个带有签名ActionResult Edit（string id）的方法，它将数据返回到放置模态的PartialView

模式已经嵌入到包含所有超链接的页面中，默认情况下不可见

---

我就是不知道如何根据传递的ID用不同的数据填充它。

您可以使用AJAX通过控制器操作从服务器加载新数据：

$(function() {
    $(document).on('click', '.open-EditBookDialog', function () {
        var myBookcaseItemId = $(this).data('id');
        // send an AJAX request to fetch the data
        $.get(this.href, { id: myBookcaseItemId }, function(data) {
            $('#editBookDialog').html(data).modal('show');
        });
        return false;
    });
});

@Html.ActionLink(
    "Some text", 
    "Edit", 
    null, 
    new {
        data_toggle = "modal",
        data_id = bookcaseItem.Id,
        title = "Edit this item",
        @class = "open-EditBookDialog"
    }
)

现在，显然您应该修改应该打开对话框的锚点，使其href指向编辑控制器操作：

$(function() {
    $(document).on('click', '.open-EditBookDialog', function () {
        var myBookcaseItemId = $(this).data('id');
        // send an AJAX request to fetch the data
        $.get(this.href, { id: myBookcaseItemId }, function(data) {
            $('#editBookDialog').html(data).modal('show');
        });
        return false;
    });
});

@Html.ActionLink(
    "Some text", 
    "Edit", 
    null, 
    new {
        data_toggle = "modal",
        data_id = bookcaseItem.Id,
        title = "Edit this item",
        @class = "open-EditBookDialog"
    }
)

---

谢谢你，差不多可以用了。代码似乎将正确的数据传递给了模态，我现在遇到的唯一问题是模态没有显示（背景变暗，但模态不可见）。我希望能找到答案（当它100%起作用时，我会把它标记为答案）。是的，它现在起作用了。它不起作用的原因是上面的代码试图将模态插入模态（即.html（）部分）。我将html（）函数替换为replaceWith（）函数，现在模式完全被新的模式所替换。@crafter，你说得对。谢谢你指出这一点。我已经更新了答案。

@Html.ActionLink(
    "Some text", 
    "Edit", 
    null, 
    new {
        data_toggle = "modal",
        data_id = bookcaseItem.Id,
        title = "Edit this item",
        @class = "open-EditBookDialog"
    }
)