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

问题描述：

我想用部分视图替换主视图中div的内容，具体取决于单击哪个@ Ajax.ActionLink。MVC 4 - Ajax - 用另一个替换一个局部视图

最初我加载_CaseLoad部分视图，然后我希望能够在两个部分视图_CaseLoad和_Vacancies之间切换，当我点击相关的ActionLink。我在'Main'文件夹中使用了部分视图和Index视图。

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

控制器动作（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>

答

您对@ Ajax.ActionLink电话是错的，你这样做：

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

这意味着你的链接文本是“工作量”，而行动“MainController”被称为是“_CaseLoad” ？是不是“_CaseLoad”你的局部视图的名称？为了解决这个问题，你必须在你的MainController中创建CaseLoad和Vacancies动作，使这两个方法返回PartialView（“_ CaseLoad.cshtml”，model）;或PartialView（“_ Vacancies.cshtml，模型）象下面这样：。

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

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

我只是切断了所有的实现细节只是为了让您了解如何解决这个问题的想法

答

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

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

相关推荐