如何在MVC3中呈现部分视图

Question

如何在MVC3中呈现部分视图

6

我在应用程序中尝试呈现局部视图，但无法显示值。以下是我的视图示例。

我的主索引视图

 <div id="RPPricingNameModel">
     @Html.Partial("RPPricingPlanNames")
 </div>
<script type="text/javascript">
    $("#RPPricingNameModel").load("/Home/GetPlanNameModel");    
</script>

部分视图

@model PlanNameModel     
<table style= "vertical-align:top; left:0px; top:0px; position:absolute; border-width:1px; border-style:solid; border-color:Green;  width:130px; text-align:left;">    
    <tr>
        <td style=" font-size:15px; font-weight:bold; color:Black;">            
            @Model.Header
           <div>            
                  @Html.LabelFor(x => x.Header)               
           </div>   
        </td>
    </tr>
<table>

这里是返回视图的控制器。

public ActionResult GetPlanNameModel()
{
   PlanNameModel planNameModel = new PlanNameModel();
   planNameModel.Header = "Plans";
   //return View(planNameModel);
   return PartialView(planNameModel);   
}

这里是模型的代码。

public class RPPricingPlanNameModel
{
  public string Header { get; set; }
}

当我尝试在 TD 中显示数值时，它没有显示任何内容。你能帮我解决这个问题吗？

- Vivek Patel

4个回答

1

看起来你在 jQuery 选择器中缺少了你要查找的选择器

你需要添加：

<div id="RPPricingNameModel"></div>

返回你的DOM

同时你的@m.Header应该改为@Model.Header

最后，加载局部视图的JavaScript不应该在局部视图中，而应该在你想要加载局部视图的主视图中

- Bassam Mehanni

我尝试了这个。对我来说不起作用。它显示的是值“Header”，而不是我分配给Model.Header的实际值“Plans”。 - Vivek Patel

也尝试过了。将Javascript移动到主Index.cshtml并将m.Header更改为@Model.Header。现在出现空引用异常。 - Vivek Patel

如果您在GetPlanNameModel()中设置断点会发生什么？它是否能够到达那里？ - Bassam Mehanni

是的，它正在进行中。我可以看到我返回的模型不为空。 - Vivek Patel

更新你的问题以反映最新的更改，也许我们就能够发现问题了，因为如果你进行了这些更改，你的模型就不应该为空。 - Bassam Mehanni

我刚刚更新了我的问题并进行了更改。我正在尝试不同的组合来获取值。如果您认为我做错了什么，请给予建议。谢谢！ - Vivek Patel

0

用以下代码替换您的索引：

<div id="RPPricingNameModel"></div>

<script type="text/javascript">
  $(function(){$("#RPPricingNameModel").load("/Home/GetPlanNameModel");});
</script>

空引用是由对你的部分调用的初始调用导致的

@Html.Partial("RPPricingPlanNames")

没有所需的模型

- Bassam Mehanni

现在我得到的是''作为结果，而不是任何值。我怎样才能消除那个空引用错误？ - Vivek Patel

另一个建议：将“load”替换为“get”。 - Bassam Mehanni

基本上我想做的就是从数据库中加载一些文本到我的页面上。我的页面有不同的部分，我已经将它们分成了不同的局部视图。现在我想用数据库中的文本来加载这些标签。我正在尝试使用这种技术来实现，但似乎它并没有起作用。还有其他的想法吗？ - Vivek Patel

0

将 $("#RPPricingNameModel").load("/Home/GetPlanNameModel"); 包装在文档准备好之后执行，以便仅在完整 DOM 加载后执行。

$(function(){

 $("#RPPricingNameModel").load("/Home/GetPlanNameModel");

});

- Shyju

已经涵盖在我的答案中了，不幸的是那似乎不是问题所在。 - Bassam Mehanni

这似乎很简单，但不知怎么的我就是无法让它工作。 :( - Vivek Patel

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Bassam Mehanni · Accepted Answer

如果你只是想使用partialViews而不是通过jquery动态加载它们，请查看我对这个问题的答案，它可能会解决你的问题：

MVC3 Partial Views

你需要创建一个ViewModel来为你的index页面提供所有partial view所需的对象。

Controller ActionMethod:

public ActionResult Index()
{
  PlanNameModel planNameModel = new PlanNameModel();
  planNameModel.Header = "Plans";
  ViewData.Model = new IndexVm{ PlanNameModel = planNameModel };
}

视图模型：

   public class IndexVm
   {
     public PlanNameModel PlanNameModel { get; set; }
   }

首页视图

@model IndexVm

@*Whatever index code you have*@

@Html.Partial("PlanPartial", Model.PlanNameModel)

部分视图

@model PlanNameModel

<div>@Model.Header</div>