Question

我想使用Visual Studio 2013中的MVC模型在asp.net中创建一个动态网站。

所有列都将包含动态内容，每个列都会根据用户操作或控制器更改不同选择的内容。

如何创建这三个动态列？

我已经在HTML和CSS中使用了我的布局，但是我需要将这三列分开，并且可以从我的控制器中更改它们的内容。

稍后编辑：在我的情况下，我在网站上有两个菜单，一个在左边，另一个在右边。实际上他们是三个，另一个是从顶部。当我从顶部选择某些内容时，必须根据顶部选择显示左侧的菜单。

Answer 1

您可以使用ViewBag或ViewData填充每列。因此，在布局中，使用此数据来填充此列，例如：

1）调用此操作将更改您指定的内容的内容：

public ActionResult MyView()
{
  // you can put anything in this ViewBag, 
  // a string, a list of something and then use it in the view
  // Its dinamyc

  ViewBag.Column1 = "My content column 1";
  ViewBag.Column2 = "My content column 2";
  ViewBag.Column3 = new string[] {"Product1", "Product1", "Product1"};
}

2）在布局中使用此数据以生成动态内容：

<div id='column1'>
  @ViewBag.Column1
</div>
<div id='column2'>
  @ViewBag.Column2
</div>
<div id='column3'>
  <ul>
  @foreach(var s in ViewBag.Column3)
  {
    <li>
      @s
    </li>
  }
  <ul>

您应该在这里查看更多信息：

What is ViewData, ViewBag and TempData?

你也应该使用章节，看看这里：

ASP.NET MVC 3: Layouts and Sections with Razor

Answer 2

我建议你做三个不同的控制器动作。例如：

public ActionResult Part1()
{
return View();
}

public ActionResult Part2()
{
return View();
}

public ActionResult Part3()
{
return View();
}

然后在您的公共页面中调用它们。例如：

<div class="row">
   <div class="col-md-4">
      @Html.Action("Part1")
    </div>
   <div class="col-md-4">
      @Html.Action("Part2")
    </div>
   <div class="col-md-4">
      @Html.Action("Part3")
    </div>
</div>

您可以在控制器视图中包含选择条件控件。即如果你需要第一块的下拉列表。将它放在Part1视图中。另外，要使其异步，您可以在所有三个视图中使用Ajax表单。

创建三列布局，全部动态

2 个答案: