我知道这是一个很长的标题^^
我正在使用 MVC 4 和 JQuery 版本 1.8.2。
我在 JQuery 对话框中加载 PartialView 并且一切正常。
最近我想添加一些 Javascript，在对话框中隐藏一个文本框，这开始了我的痛苦。
Javascript隐藏代码有效：
- 只有一次，如果我用 $(this).dialog('close'); 关闭对话框
- 每次，如果我用 $(this).remove(); 关闭对话框
我不是 JQuery / Javascript 方面的专家，但我想了解发生了什么:)
这是我的代码：
$(function dialogLink() {
// Don't allow browser caching of forms
$.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 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,
height: 'auto',
width: 'auto',
resizable: false,
title: dialogTitle,
buttons: {
"Save": function () {
// Manually submit the form
var form = $('form', this);
$(form).submit();
},
"Cancel": function () { $(this).dialog('close'); }
//"Cancel": function () { $(this).remove(); }
}
});
// Enable client side validation
$.validator.unobtrusive.parse(this);
// Setup the ajax submit logic
wireUpForm(this, updateTargetId, updateUrl);
// Working only once code
$('#PossibleAnswerContainer').hide();
$('#StatisticDataType').on('change', function (e) {
e.preventDefault();
if ($(this).val() === 'List') {
$('#PossibleAnswerContainer').show();
} else {
$('#PossibleAnswerContainer').hide();
}
});
});
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');
// Reload the updated data in the target div
$(updateTargetId).load(updateUrl);
} else {
// 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;
});
}