MVC 4- Ajax -用一个视图替换另一个视图

Question

我正在尝试将主视图中的div内容替换为部分视图，这取决于所单击的@Ajax.ActionLink。

最初，我加载了_CaseLoad局部视图，然后当我单击相关的ActionLink时，我希望能够在两个局部视图_CaseLoad和_Vacancies之间切换。我在'Main‘文件夹中有分部视图和索引视图。

当我点击‘职位空缺’链接时，它会简短地显示LoadingElementID，但它不会用_CaseLoad局部视图替换_Vacancies局部视图？

控制器操作(MainController)：

    public ActionResult Index(int page = 1, string searchTerm = null)
    {
        MainIndexViewModel model = new MainIndexViewModel()
        // Populate Model

        return View(model);

    }

主索引视图：

@model Project.WebUI.Models.MainIndexViewModel

@{
  ViewBag.Title = "Index";
  Layout = "~/Views/Shared/_Layout.cshtml";
}

<div id="MainIndex">
        <div id="Menu">

            @Ajax.ActionLink("CaseLoad", "_CaseLoad", "Main", null, new AjaxOptions() { UpdateTargetId = "Main", InsertionMode = InsertionMode.Replace, HttpMethod = "GET",
                LoadingElementId = "busycycle" }) |

            @Ajax.ActionLink("Vacancies", "_Vacancies", "Main", null, new AjaxOptions() { UpdateTargetId = "Main", InsertionMode = InsertionMode.Replace, HttpMethod = "GET",
                LoadingElementId = "busycycle" })

        </div><hr/>


        <div id="busycycle" style="display:none;"><img src="~/Content/images/preloader-w8-cycle-black.gif" /></div>
        <div id="Main">
            @Html.Partial("_CaseLoad")
        </div>

    </div>

Answer 1

您对@Ajax.ActionLink的调用是错误的，您正在执行以下操作：

@Ajax.ActionLink("CaseLoad", "_CaseLoad", "Main", null, new AjaxOptions() { UpdateTargetId = "Main", InsertionMode = InsertionMode.Replace, HttpMethod = "GET",
            LoadingElementId = "busycycle" })

这意味着您的链接文本是"CaseLoad"，而"MainController“中要调用的操作是"_CaseLoad"？"_CaseLoad“不是你的局部视图的名字吗？

要解决此问题，您必须在MainController中创建CaseLoad和一个空缺操作，使这两个方法都返回PartialView("_CaseLoad.cshtml"，模型)或PartialView("_Vacancies.cshtml，模型)，如下所示：

public ActionResult CaseLoad(int page = 1, string searchTerm = null)
{
    MainIndexViewModel model = new MainIndexViewModel()
    // Poopulate Model

    return PartialView("_CaseLoad.cshtml", model);
}

我只是去掉了所有的实现细节，只是为了让你对如何解决这个问题有所了解。