使用 ajax 加载模型时将数据传递给引导模型

Question

单击日期后我有一个日历，我需要在引导模型中显示与该天相关的所有数据。我使用全日历作为我的日历。我设法通过ajax将数据传递给控制器​​并得到结果。但我的问题是如何在特定的 div 中显示这些数据。

             dayClick: function (date, jsEvent, view) {
                $.ajax({
                    url: 'TodayCases',
                    type: 'GET',
                    cache: false,
                    data: { id: date.format() }
                }).done(function (result) {
                    $('#TodayCaseContainer').html(result);
                });
             }

如果我使用$('#Detail').modal('show');，它会打开没有数据的模型，如何组合该 html 响应该模型

我的模特是

<div class="modal fade" id="Detail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
        </div>
        <div class="modal-body">
            <div id="TodayCaseContainer">
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
    </div>
</div>

Answer 1

您可以从控制器返回带有模态内容的局部视图。诀窍是从 ajax 调用 JavaScript 函数“onsuccess”来切换模式。我使用了 asp.net MVC 5 中的内置 ajaxhelper 来实现类似的目的。

标记模式：

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        @Html.Action("_partialModal", "Home")
    </div>
</div>

模态局部视图：

@Using Ajax.BeginForm("_partialModal", "Home", New AjaxOption With {
                                              .HttpMethode = "Post",
                                              .UpdateTargetID = "ModalCont",
                                              .OnSuccess = "toggleModal()"}, 
                                              New With {.id = "ModalCont"})
 ... Your modal content with Razor ...
End Using

JavaScript 切换模式

    function toggleModal() {
        $('#myModal').modal('toggle');
    }

希望对你有帮助。