Question

我正在尝试使用部分视图替换主视图中div的内容，具体取决于单击哪个@ Ajax.ActionLink。

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

当我点击'Vacancies'链接时，它会简要显示LoadingElementID，但它不会用_Vacancies局部视图替换_CaseLoad局部视图？

Controller Action（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和Vacancies动作，使两个方法都返回PartialView（“_ CaseLoad.cshtml”，model）;或PartialView（“_ Vacancies.cshtml，model”）如下所示：

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

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

我只是切断了所有实施细节，以便让您了解如何解决问题。

Answer 2

我想尝试使用具有一组开发工具的浏览器（我建议使用Chrome）并点击 F12 。打开开发工具后，切换到“网络”选项卡，然后单击ajax链接。 Loading元素仅在请求正在进行时显示，并不一定意味着它成功。通过使用“网络”选项卡，您应该能够看到Ajax请求的响应是什么，并确定它是否是错误，以及生成的部分视图实际上是什么。

MVC 4 - Ajax - 将一个局部视图替换为另一个视图

2 个答案: