Ajax.BeginForm替换整个页面

Question

我已经阅读了许多类似的问题，但仍然无法弄清楚问题所在。我的 Ajax.BeginForm 在 Controller 中通过 PartialView 返回一条消息，但此字符串会替换整个页面。

View：

   @using (Ajax.BeginForm("NoMoreItem", "ProductListing", 
new AjaxOptions
{
HttpMethod = "get",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = string.Concat("NoMoreItemSection1-", counter)
}, new { @id = string.Concat("NoMoreItemForm1-", counter) }))
{
    <input type="hidden" value="@Model.Email" name="email" />
    <input type="hidden" value="@i.code" name="code" />
    <input type="submit" value="notify me" />
}
</div>

我的控制器：

public ActionResult NoMoreItem(string email, string productCode)
{
    string message;
    _waitinglist.Save(email, productCode);
    message = "Item added to Waiting List";
    return PartialView("ItemAdded", message);
}

ItemAdded View:

@model string
<div>
    @Model
</div>

我在 _Layout.cshtml 中引用了 jquery.unobtrusive-ajax.js 文件，所以它似乎不是问题的原因。

有人知道为什么消息会替换整个页面吗？

- jkl

---

当出现这种情况时，大多数情况是由于脚本加载不当。请参见此处https://dev59.com/94Daa4cB1Zd3GeqP_hRH - Jasen

在您单击按钮之前，呈现的HTML看起来是什么样子？ - Jasen

@Jasen 一个包含项目名称和按钮的表格。我在布局中包含了js文件，但是在ItemAdded视图中没有使用布局。也许这就是原因？如果是这样，那么我应该在局部视图或父视图中引用js文件吗？ - jkl

ItemAdded 是一个 partial，应该与布局一起加载到其他视图中 - 这很好。检查调试控制台上是否有错误。检查渲染的 HTML 是否包含 jquery.js 和 _jquery.unobtrusive-ajax.js_。确保页面上的 ID 是唯一的。主视图中的目标 ID NoMoreItemSection1-counter 在哪里？ - Jasen

Answer 1

请确保引用 MS 文件。

 <script src="../../Scripts/MicrosoftAjax.js" type="text/javascript"></script>
    <script src="../../Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>

我认为你正在寻找发布而不是获取。

- COLD TOLD

---

这些脚本已经过时。https://dev59.com/UWoy5IYBdhLWcg3wFqJT - Jasen

但你仍然需要将它们包含进来。 - COLD TOLD

不，它不起作用。奇怪的是，当我在页面完全加载之前点击按钮时，它可以工作。但在页面完全加载后停止工作。太奇怪了。 - jkl

Answer 2

对于那些在谷歌上转了一圈却找不到解决方案的人，

请确保web.config文件中的appsettings部分中有UnobtrusiveJavaScriptEnabled=true。

- mytech

Answer 3

请仔细检查页面中是否正确加载了jquery.unobtrusive-ajax.js，并检查输入标签中产品代码的名称（应与操作参数相等）。

如果这解决了您的问题，请告诉我。

- Carlos Araujo

---

bundles.Add(new ScriptBundle("~/bundles/js").Include("~/Scripts/jquery.unobtrusive-ajax.js")); - jkl

不行，它不起作用。奇怪的是，当我在页面完全加载之前点击按钮时，它可以工作。但是在页面完全加载后停止工作。太奇怪了。 - jkl