Question

我有这个烦人的问题，我一直在努力修复过去几晚。到目前为止没有运气。我有一个视图与模态和局部视图，呈现在模态中。我在部分视图中填写了基于我在控制表中单击按钮时传递给控制器的参数的数据。第一个很顺利，按钮调用控制器 - ＆gt;控制器将模型传递给partialview - ＆gt;模态打开，右侧数据在字段中。

当我单击另一条记录上的按钮时，将打开模态并显示旧数据。未再次调用控制器，因此数据不会刷新。问题是，如果我用shift + f5刷新页面，它会再次工作一次。所以它似乎是一个缓存问题。

到目前为止我尝试了什么 - 在我的控制器和方法中禁用缓存 - 调用javascript方法从我的模态中删除数据 - 使用其他类型的模态

代码索引视图

<div class="wrapper wrapper-content animated fadeInRight">
<div class="row">
    <div class="col-lg-12">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>List of registrations</h5>
                <div class="ibox-tools">
                    @Html.ActionLink("Create New", "Create", null, new { @class = "btn btn-primary btn-xs" })
                </div>
            </div>
            <div class="ibox-content">
                <table class="table table-striped" id="datatable">
                    <thead>
                        <tr>
                            <th>
                                @Html.DisplayNameFor(model => model.Date)
                            </th>

                            <th>
                                @Html.DisplayNameFor(model => model.Car.Kenteken)
                            </th>

                            <th>
                                @Html.DisplayNameFor(model => model.DepartureLocation)
                            </th>

                            <th>
                                @Html.DisplayNameFor(model => model.ArrivalLocation)
                            </th>

                            <th>
                                @Html.DisplayNameFor(model => model.Distance)
                            </th>
                            <th>
                                @Html.DisplayNameFor(model => model.Allowance)
                            </th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var item in Model)
                        {
                            <tr>
                                <td>
                                    @Html.DisplayFor(modelItem => item.Date)
                                </td>

                                <td>
                                    @Html.DisplayFor(modelItem => item.Car.Kenteken)
                                </td>

                                <td>
                                    @Html.DisplayFor(modelItem => item.DepartureLocation)
                                </td>

                                <td>
                                    @Html.DisplayFor(modelItem => item.ArrivalLocation)
                                </td>

                                <td>
                                    @Html.DisplayFor(modelItem => item.Distance)
                                </td>

                                <td>
                                    @Html.DisplayFor(modelItem => item.Allowance)
                                </td>
                                <td>
                                    @Html.ActionLink("Edit", "Edit", new { id = item.CarId }, new { @class = "btn btn-white btn-sm" })
                                    @Html.ActionLink("Delete", "Delete", new { id = item.CarId }, new { @class = "btn btn-white btn-sm" })
                                    @Html.ActionLink("Copy", "CopyTripRegistrationModal", "TripRegistration", new { registrationId = item.RegistrationID }, new { @class = "img-btn-addnote modal-link btn btn-white btn-sm" })
                                </td>
                            </tr>
                        }
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<div id="modal-container" class="modal fade" tabindex="-1" role="dialog">
<a href="#close" title="Close" class="modal-close-btn">X</a>
<div class="modal-content">
    <div class="modal-body"></div>
</div>

的Javascript

<script>
$(function () {
    $('body').on('click', '.modal-link', function (e) {
        e.preventDefault();
        $(this).attr('data-target', '#modal-container');
        $(this).attr('data-toggle', 'modal');
    });

    $('body').on('click', '.modal-close-btn', function () {
        $('#modal-container').modal('hide');
    });

    debugger;
    $("#modal-container").on("hidden.bs.modal", function () {
        $(".modal-body").removeData();
    });
});

部分视图

<div class="modal-body">
        @using (Html.BeginForm("Create", "TripRegistration"))
        {
            @Html.AntiForgeryToken()

            <div class="form-horizontal">

                @Html.ValidationSummary(true)
                @Html.HiddenFor(model => model.CarId)

                <div class="form-group">
                    @Html.LabelFor(model => model.Date, new { @class = "control-label col-md-2" })
                    <div class="col-md-10">
                        @Html.EditorFor(model => Model.Date, new { htmlAttributes = new { @class = "form-control" } })
                        @Html.ValidationMessageFor(model => model.Date)
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(model => model.DepartureLocation, new { @class = "control-label col-md-2" })
                    <div class="col-md-10">
                        @Html.EditorFor(model => model.DepartureLocation)
                        @Html.ValidationMessageFor(model => model.DepartureLocation)
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(model => model.DepartureZipcode, new { @class = "control-label col-md-2" })
                    <div class="col-md-10">
                        @Html.EditorFor(model => model.DepartureZipcode)
                        @Html.ValidationMessageFor(model => model.DepartureZipcode)
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(model => model.ArrivalLocation, new { @class = "control-label col-md-2" })
                    <div class="col-md-10">
                        @Html.EditorFor(model => model.ArrivalLocation)
                        @Html.ValidationMessageFor(model => model.ArrivalLocation)
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(model => model.ArrivalZipcode, new { @class = "control-label col-md-2" })
                    <div class="col-md-10">
                        @Html.EditorFor(model => model.ArrivalZipcode)
                        @Html.ValidationMessageFor(model => model.ArrivalZipcode)
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(model => model.Distance, new { @class = "control-label col-md-2" })
                    <div class="col-md-10">
                        @Html.EditorFor(model => model.Distance)
                        @Html.ValidationMessageFor(model => model.Distance)
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-md-offset-2 col-md-10">
                        <button type="button" class="btn btn-white" id="cancel">Close</button>
                        <button type="submit" class="btn btn-primary">Copy registration</button>
                    </div>
                </div>
            </div>
        }
    </div>

控制器操作

        [NoCache]
    public PartialViewResult CopyTripRegistrationModal(int registrationId)
    {
        var tripRegistration = _tripRegistrationService.getTripRegistrationById(registrationId);
        var tripRegistrationVM = AutoMapper.Mapper.Map<tblTripRegistration, TripRegistrationViewModel>(tripRegistration);
        return PartialView("_CopyTripRegistration", tripRegistrationVM);        
    }

我已将“[OutputCache（Duration = 0）]”添加到控制器的顶部。

我希望有人可以帮助我！

Answer 1

您可以明确地进行ajax调用并将其响应设置为模态体。

$(function () {

     $('body').on('click', '.modal-link', function (e) {
         e.preventDefault();

         $("#modal-container").remove();
         $.get($(this).attr("href"), function (data) {
                 $('<div id="modal-container" class="modal fade">
                        <div class="modal-content" id="modalbody">' 
                                               + data + '</div></div>').modal();
         });
    });
});

这适用于您所有独特的网址。

在模态中加载模型只能工作一次

1 个答案: