我一直在使用文章ASP.NET MVC: Ajax Dialog Form Using jQuery UI中的代碼,它主要工作。我創建了一個列出記錄的網格,每條記錄都有一個鏈接來打開一個對話框來編輯記錄。記錄更改後,按下保存按鈕並使用ajax更新網格。這很好,但問題出現在網格的第一條記錄保存和ajax刷新之後。如果再次單擊編輯記錄的鏈接,則對話框不會出現,只顯示局部視圖。我猜測,但似乎我試圖再次提出的部分觀點不承認父容器。有任何想法嗎?MVC對話框保存刷新錶停止工作
顯示包含電網的局部視圖:
<div id="VehicleHold">
@Html.Partial("_VehicleHold")
</div>
局部視圖,使彈出的對話框:
@using VehicleWeb.MVCHelpers
@{
int agreementNumber = 0;
var countData = ViewBag.VehicleHoldViewModel as System.Collections.Generic.IEnumerable<VehicleWeb.Model.VehicleHoldViewModel>;
if (countData != null)
{
if (countData.Count() > 0)
{
agreementNumber = (int)countData.DefaultIfEmpty().First().AgreementNumber;
<table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered">
<thead>
<tr class="table-header">
<th>Edit</th>
<th>Delete</th>
<th>
Type
</th>
<th>
Year
</th>
<th>
Make/Model
</th>
<th>
Plate
</th>
<th>
VIN
</th>
<th>
Num Pass
</th>
</tr>
</thead>
<tbody>
@{
foreach (var item in (ViewBag.VehicleHoldViewModel as System.Collections.Generic.IEnumerable<VehicleWeb.Model.VehicleHoldViewModel>))
{
<tr>
<td>
@Html.ImageDialogLink("UpdateVehicleHold", "Exposure", new { id = item.RID }, "Edit Hold Vehicle", "VehicleHold", Url.Action("RefreshVehicleHold/" + agreementNumber), Html.ResolveUrl("~/pics/edit-button.png"), "Edit Hold Vehicle", "600", "800", new { style = "text-decoration:none;" }, new { style = "text-decoration:none; border-style: none;" })
</td>
<td>
<div title="Vehicle Year">@item.EditType.ToString()</div>
</td>
<td>
<div title="Vehicle Year">@item.AutoYear.ToString()</div>
</td>
<td>
<div title="Vehicle Make/Model">@item.MakeModel.ToString()</div>
</td>
<td>
<div title="Vehicle Plate Number">@item.DistVehNo.ToString()</div>
</td>
<td>
<div title="Vehicle VIN">@item.IDNumber.ToString()</div>
</td>
<td>
<div title="Number Of Passengers">@item.NumOfPassengers.ToString()</div>
</td>
</tr>
}
}
</tbody>
</table>
}
}
}
我新的發問這裏,所以才讓我知道如果你需要看到更多的代碼。
編輯: 我不知道jQuery文件的位置是否重要。我今天一直在搞這個職位,並沒有找到成功。我在主窗體上有用於連接對話框的jQuery文件。在AJAX刷新DIV之後,編輯鏈接似乎鬆散了關於任何父代碼的所有知識。我最新的理論是這可能與這個代碼有關。難道是因爲它已經準備好了嗎?
$(document).ready(function() {
$.ajaxSetup({
cache: false
});
// Wire up the click event of any current or future dialog links
$('.dialogLink').on('click', function() {
var element = $(this);
// Retrieve values from the HTML5 data attributes of the link
var dialogTitle = element.attr('data-dialog-title');
var dialogWidth = element.attr('data-dialog-width');
var dialogHeight = element.attr('data-dialog-height');
var updateTargetId = '#' + element.attr('data-update-target-id');
var updateUrl = element.attr('data-update-url');
// Generate a unique id for the dialog div
var dialogId = 'uniqueName-' + Math.floor(Math.random() * 1000)
var dialogDiv = "<div id='" + dialogId + "'></div>";
// Load the form into the dialog div
$(dialogDiv).load(this.href, function() {
$(this).dialog({
modal: true,
resizable: false,
title: dialogTitle,
closeOnEscape: false,
width: dialogWidth,
height: dialogHeight,
buttons: [
{
text: "Save",
icons: { primary: "ui-icon-check" },
click: function() {
// Manually submit the form
var form = $('form', this);
if ($(form).valid()) {
$(form).submit();
$(this).dialog('close');
}
}},
{
text: "Cancel",
icons: { primary: "ui-icon-closethick" },
click: function() {
$(this).dialog('close');
$(this).empty();
}
}]
});
// Enable client side validation
$.validator.unobtrusive.parse(this);
// Setup the ajax submit logic
wireUpForm(this, updateTargetId, updateUrl);
});
return false;
});
});
function wireUpForm(dialog, updateTargetId, updateUrl) {
$('form', dialog).submit(function() {
// Do not submit if the form
// does not pass client side validation
if (!$(this).valid()) {
return false;
}
// Client side validation passed, submit the form
// using the jQuery.ajax form
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (result) {
// Check whether the post was successful
if (result.success) {
// Close the dialog
$(dialog).dialog('close');
$(dialog).empty();
// Reload the updated data in the target div
$(updateTargetId).load(updateUrl);
} else {
alert('failure');
// Reload the dialog to show model errors
$(dialog).html(result);
// Enable client side validation
$.validator.unobtrusive.parse(dialog);
// Setup the ajax submit logic
wireUpForm(dialog, updateTargetId, updateUrl);
}
}
});
return false;
});
}
我添加了設置對話框的代碼。這個代碼可能是問題嗎? – Filjan
將這個$('。dialogLink')。on('click',function()整個函數在局部視圖中,並讓我知道它是否工作 –
這是違規行,但我不必移動它。 $('。dialogLink')。live('click',function(){and this does not work $('。dialogLink')。on('click',function(){。我不確定是什麼不同之處在於「活」和「開」之間,但我最好弄清楚,因爲這是使這項工作的關鍵。感謝您的幫助。 – Filjan