Question

我有以下引导模式对话框：

<div class="modal fade" id="resultModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" 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">Update</h4>
        </div>
        <div class="modal-body wrap">            


        </div>
        <div class="modal-footer">
             <button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
        </div>
    </div>
</div>
</div>

请注意模态主体是空的。

我有以下调用来获取我想在正文（）中显示的HTML数据：

 $.ajax({
                url: '@Url.Action("GetContent", "Sys")',
                type: 'POST',
                data: { siteID: @Model.SiteID},
                dataType: "html",
                cache: false,
                 success: function (data) {                 
                     //  I like to show content of data inside of the dialog box body. 
                     $('#resultModal').modal({
                         backdrop: 'static',
                         keyboard: false,
                         show: true,
                     });

                },
                error: function (xhr, status) {

                },
            });

我想做的是在对话框主体内部显示HTML中的数据内容。

Answer 1

让我对您的代码有两个假设（它适用于代码段，但您必须确保在您的应用程序中正确处理了该代码）：

模式主体的选择器是其类，更改模式ID（在此示例中：<ul id="hexGrid"> <li> <div class="hexagon"> </div> </li> </ul>。进行适当更改）
您要呈现的AJAX数据填充了整个#resultModal .modal-body参数（您可以提取数据的相应部分以满足您的需求）。

那是说：我们想在模态主体中显示数据。因此，我们需要获取数据，并使用它来呈现元素的文本或HTML（如果您担心注入，请使用前者，如果您知道内容并且可以信任它，请使用后者）。 / p>

通过使用您提供的调用代码段，我们可以编写以下代码（我将通过用注释将其突出显示修改的部分）：

data

希望有帮助！

引导对话框基于ajax调用在正文中显示HTML内容

1 个答案: