我在其他视图模型中使用小模型的局部视图。所以我通过从包装器表单中获取模型数据并使用serializeArray()
来发送它的更改。然后从动作返回PartialViewResult
,最后通过返回的结果填充部分视图div容器。这是我的代码:
var modelStr = $("#[wrapperFormName]").serializeArray();
$.ajax({
type: "POST",
url: targetUrl,
cache: false,
data: modelStr,
success: function (sucResult) {
$('#pa_Cnt').html(sucResult);
},
fail: function (result) {
alert("Fail");
}
});
并在视图中呈现partialview:
@using (Html.BeginForm("[ActionName]", "[CtrlName]", FormMethod.Post, new { id = "[wrapperFormName]", @enctype = "multipart/form-data" }))
{
<div id="[partialcontainerName]">
@Html.Partial("[partialViewName]", [partialViewModelName])
</div>
}
其中一个问题是更新部分视图后返回结果不能使用任何绑定到partial内部元素的jQuery事件处理程序,我知道事件处理程序必须在主视图中声明而不是部分声明,并且必须委托处理程序。
第二个问题是更新结果有新值,但部分视图中的一些元素显示旧值,我将ajax的缓存设置为false,作为[OutputCache(Duration = 0)]
的操作缓存。
我很困惑。任何人都可以帮助我。
答案 0 :(得分:1)
您的第一个问题是因为您必须重新添加您的事件处理程序。我假设您在$(document).ready
内添加事件处理程序或在页面加载时添加等效事件处理程序。在使用$ .ajax刷新部分内容之后,具有事件处理程序的原始元素不再存在 - 它们的实例已被替换,因此事件处理程序不会被激活。您需要在行后的success
回调中重新添加事件处理程序:
$('#pa_Cnt').html(sucResult);
不确定第二个问题..
答案 1 :(得分:1)
我找到了。感谢@David的第一期。我将委托事件的内部操作分离到指向变量名称的函数,并在更新部分返回结果的html后将委托事件附加到它们。这是一个简单的样本:
var sampleHandler = function() { //some code }
然后在ajax成功:
success: function (sucResult) {
$('#pa_Cnt').html(sucResult);
$("[parentClassNameSelector]").on("click", '[childSelector]', sampleHandler);
}
关于第二个问题MVC的ModelState是Guilty。 :)特别是在由mvc帮助器呈现的元素中。所以我决定在控制器动作中这样做。
if (ModelState.IsValid) { ModelState.Clear(); }
我不知道这是好还是有任何其他问题。现在它解决了我的问题。我正在等待新的评论和建议。非常感谢。