为什么不引人注目的Ajax需要一个布局页面(返回部分视图不起作用)？
在创建自定义插件时，Ajax会对尚未被未公开的Ajax进行Ajax处理的任何form进行Ajax处理，但我注意到，我的部分/布局代码未能在回发时以普通的、不显眼的Ajax形式显示：
对于我的其他部分更新插件，我有条件地将页面呈现为分部(对于ajax请求)或填充布局(对于普通请求)，如下所示：
public ActionResult AjaxForm()
{
if (!Request.IsAjaxRequest())
{
ViewBag.Layout = "_Layout.cshtml";
}
return PartialView();
}
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult AjaxForm(AjaxFormModel model)
{
if (!Request.IsAjaxRequest())
{
ViewBag.Layout = "_Layout.cshtml";
}
if (ModelState.IsValid)
{
return PartialView("Success", model);
}
return PartialView(model);
}当测试一个普通的、不引人注目的Ajax表单时，我使用了这个测试视图，它只更新了它自己的元素UpdateTargetId="FormPanel"。
@using (Ajax.BeginForm("AjaxForm", null, new AjaxOptions() { UpdateTargetId = "FormPanel" }, new { id = "FormPanel" }))
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<div class="form-group">
@Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.AddressLine, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.AddressLine, new { htmlAttributes = new { @class = "form-control" } })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}如果我移除测试if (!Request.IsAjaxRequest())，并返回带有母版页/布局的完整页面，它就会将结果呈现在表单所在的位置。
Fiddler显示在两种情况下都会返回"success“视图，但是如果没有布局，它不会做任何事情。
Q.为了提取内容并替换指定的元素，在一个不引人注目的Ajax主页/布局中需要什么？
更新：
更糟糕的是，它实际上在第一次正确工作，但如果我再次加载相同的表单，则不会。
回答 1
Stack Overflow用户
发布于 2014-06-18 14:37:12
表单必须有唯一的ID！
在SO上存在大量关于唯一id的问题，浏览器通常会处理这些问题，但是您永远无法打破的问题是有两个表单加载相同的id。只有一个对JavaScript/jQuery!可见
我的问题是由重复的表单ID引起的。您不应该将结果页插入表单本身(保持表单元素完整)。
当我在幻灯片样式的控件中动态地重新加载原始表单时，我最终得到了重复的表单ID。
这意味着低调的Ajax只能看到DOM中的第一种形式！
解决方案(不要设置Ajax表单来更新自己)：
将UpdateTargetId设置为窗体上方的元素，如果动态加载面板，则不要设置表单本身。
修正我的示例视图(用目标面板环绕表单)：
<div id="FormPanel">
@using (Ajax.BeginForm("AjaxForm", new AjaxOptions() { UpdateTargetId = "FormPanel" }))https://stackoverflow.com/questions/24287849
复制相似问题
腾讯云开发者
