ASP.. NET MVC4 Ajax ActionLink helper不起作用——用返回的部分视图重新加载整个页面

本文关键字：新加载 加载 视图 ActionLink Ajax MVC4 NET helper 不起作用 ASP 返回 | 更新日期: 2023-09-27 18:02:55

我有一个非常简单的MVC项目索引页，它允许您创建"作业"和编辑现有的作业。我试图使用Ajax链接将div的内容替换为作业编辑表单，Create()和Edit()操作将其作为部分视图返回。相反，当您单击Ajax链接时，整个页面内容将被部分视图取代，而不仅仅是适当div元素的内容。下面是相关的。cshtml代码:

@{
    string placeholder = "777777";
}
    <body>
        <ol id="JobListing">
        @Html.Partial("_ExportJobListingPartial", Model)
        </ol>
        <br /><br /><br />
        @Ajax.ActionLink("New", "Create", new AjaxOptions { UpdateTargetId = "EditJobContainer", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" })
        <br /><br />
        <div id="EditJobLinkContainer">
        @Ajax.ActionLink("Edit", "Edit", 
            new { id = placeholder }, // Route values
            new AjaxOptions { UpdateTargetId = "EditJobContainer", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" }, // Ajax options
            new { id = "EditJobLink" } // Html attributes
            ) 
        </div>
        <br /><br />
        <div id="EditJobContainer">
        EMPTY BOX HERE
        </div>
        <br />
    </body>
    </html>
    <script>
      $(function() {
          $("#JobListing").selectable({
              selected: function (event, ui) {
                  // Select only one at a time
                  $(ui.selected).addClass("ui-selected").siblings().removeClass("ui-selected");
                  $("#EditJobLinkContainer").html('@Ajax.ActionLink("Edit", "Edit", 
                    new { id = placeholder }, // Route values
                    new AjaxOptions { UpdateTargetId = "EditJobContainer", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" }, // Ajax options
                    new { id = "EditJobLink" } // Html attributes
                    )');
                  $("#EditJobLink").click(UpdateOnClick);
              }
          });
          $("#EditJobLink").click(UpdateOnClick);
          function UpdateOnClick() {
              //Get the id of the selected item
              var id = $(".ui-selected").first().attr("name");
              this.href = this.href.replace("@placeholder", id);
          }
      });
    </script>
我在网上读到的大多数类似问题的答案都表明，也许我没有正确地或在正确的地方包括不引人注目的ajax代码。我在_Layout视图中，在RenderBody()调用之前，作为 
    <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>

我知道这段代码正在加载，因为我插入了一个alert()调用到页面加载时启动的ajax.js文件中，并且链接到Chrome中的代码工作得很好。然而，我不得不在ajax脚本中用on()手动替换对live()的调用，因为live()在最新版本的jQuery中已弃用，尽管我很确定它们是使用MVC4的最新脚本。在某一时刻，Ajax调用实际上是为"New"链接工作的，但是从那以后我做了一些更改，现在已经好几天没有任何工作了。

ASP.. NET MVC4 Ajax ActionLink helper不起作用——用返回的部分视图重新加载整个页面

我使用了一个空的专用div

的HTML是

<div id="targetDiv">

，脚本是

    $(".get-roles").live("click", function (e) {
        $("#targetDiv").empty();
        $.ajax({
         url: "edit",
         type: 'GET'
         xhrFields: {
             withCredentials: true
         },
         success: function (data) {
             if (data) {
                 $("#targetDiv").append(data);
             }
             else {
                 $("#targetDiv").text("Error");
             }
         }
     });
    });

你需要在你的页面中包含这个

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
相关文章：