Question

我有一个ASP.Net MVC页面，我想使用AJAX来更新用户在表单上编辑/查看的父表的子表。我确信这是一个非常标准的模式，但因为我是平台的新手。

在我的页面中，我有以下内容：

  <ul id="see_also_list">
  <!-- this part is in a partial -->
    @if (0 < Model.RelatedCategories.Count)
    {
        foreach (string cat in Model.RelatedCategories.Keys)
        {
            <li>@Html.ActionLink(cat, "Details", new { id = Model.RelatedCategories[cat] }) 
            [@Ajax.ActionLink("remove", "RemoveSeeAlso", new { id=Model.Id, RelatedCategory = Model.RelatedCategories[cat] }, new AjaxOptions{ Confirm = "This will remove this item", HttpMethod = "POST", UpdateTargetId = "see_also_list" })]</li>
        }
    }
    else
    {
        <li>No related Categories listed.</li>
    }
  <!-- end of partial -->
  </ul>
  @using (Ajax.BeginForm("AddSeeAlso", new AjaxOptions { UpdateTargetId = "see_also_list",   InsertionMode = InsertionMode.Replace }))
  {
      @Html.HiddenFor(model => model.Id)
      @Html.DropDownList("alsoCategories", Model.LoadCategoryDropdown())
      <input type="submit" value="Add" />
  }

我遇到的问题是，Ajax表单和Ajax.ActionLink的行为方式与HTML.ActionLink相同 - 它们直接将浏览器导航到表单上的操作。当启用“确认”AjaxOption的链接时，它不会显示任何类型的确认框。我想我错过了一些关键的管道工作，或者内置的帮助器方法没有像我希望的那样多，我需要手动添加一些额外的JavaScript。

Ajax.ActionLink创建的HTML如下所示：

<ul id="see_also_list">

        <li><a href="/Category/Details/2">Advice and Information                            </a> 
        [<a data-ajax="true" data-ajax-confirm="This will remove this item" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-update="#see_also_list" href="/Category/RemoveSeeAlso/1?RelatedCategory=2">remove</a>]</li>

</ul>

我包括“jquery.validate.min.js”，“jquery.validate.unobtrusive.min.js”，“MicrosoftAjax.debug.js”和“MicrosoftMVCAjax.debug.js”。

Answer 1

我认为你错过了jquery unobtrusive库的链接（通常在你的_Layout页面中链接）

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>

如果没有这个，没有人会处理data-ajax和其他与ajax相关的属性

MVC3中的Ajax.ActionLink似乎与HTML.ActionLink相同

1 个答案: