在模式加载模型仅一次 [英] Loading model in modal works only once
问题描述
我已经得到了我一直在试图解决过去几晚这个恼人的问题。至今没有运气，虽然。我有一个模式，并且渲染成模态的局部视图的视图。我充满了基于参数点击表中的一个按钮时，我传递给我的控制器的数据partialview。第一个进入好听，按钮调用控制器 - >控制器通过模型partialview - >模态打开，正确的数据是在田间地头。
I've got this annoying problem that i've been trying to fix for the last few nights. No luck so far though. I have a view with a modal and a partial view that is rendered into the modal. I fill the partialview with data based on a parameter I pass to my controller when clicking a button in a table. The first one goes nicely, button calls controller -> controller passes model to partialview -> the modal opens and the right data is in the fields.
当我点击另一个记录按钮，模式被打开并显示旧数据。控制器不被再次调用，所以数据不刷新。问题是，它为一次又一次的工作，如果我刷新页面SHIFT + F5。所以这似乎是一个缓存的问题。
When I click a button on another record, the modal is opened and the old data is displayed. The controller isn't being called again, so the data doesn't refresh. The thing is, it does work again for one more time if i refresh the page with shift + f5. So it seems to be a cache issue.
我试过到目前为止
- 在我的控制器和方法禁用缓存
- 调用JavaScript的方法，从我的语气
删除数据 - 使用其他种类的模态
What i've tried so far - Disabling cache in my controller and methods - Calling javascript method to remove the data from my modal - Using other kind of modals
代码 $ b的$ b索引视图
Code Index view
<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（持续时间= 0）]到控制器的顶部。
And I have added "[OutputCache(Duration = 0)]" to the top of the controller.
我希望有人能帮助我出去！
I hope someone can help me out!
推荐答案
您可以明确地使Ajax调用和一套为模态的身体反应。
You can explicitly make the ajax call and set the response of that to as the modal body.
$(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();
});
});
});
这将与您的所有独特的网址。
This will work with all your unique urls.
这篇关于在模式加载模型仅一次的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
