如何在 Mvc WebGrid 中使用单个对象显示两列答案

【问题标题】：How display two columns in Mvc WebGrid with single object如何在 Mvc WebGrid 中使用单个对象显示两列
【发布时间】：2017-05-28 22:35:48
【问题描述】：

我是MVC 的新手，我想在WebGrid 的两列中显示用户名，如下所示。

目前网络网格以以下格式显示数据。

我将WebGrid 与List<string> 绑定，列表包含用户名。

我的控制器

public ActionResult Index()
{ 
    List<string> userList = new List<string>();
    userList.Add("User1");
    userList.Add("User2");
    userList.Add("User3");
    userList.Add("User4");
    return View(userList);
}

我的 Cshtml

@using (Html.BeginForm())
{
    var grid = new WebGrid(Model);
    @grid.GetHtml(columns: grid.Columns(grid.Column(format: (item) => item)));
}

【问题讨论】：

所以基本上你想在每两个用户之后打破你的行。正确的？如果你有 6 行，那么总共会有 3 行。对吗？
您没有在表格中显示任何标题的任何原因？
我感觉 webGrid 是一个错误的选择。在您的列表中，每个字符串代表一个记录，本质上是一行。您应该编写简单的循环以及表格 html 元素来获得所需的结果。
感谢您的回复。正确我必须在每两条记录后换行。要求不显示任何标题，只显示用户。如果您建议我如何通过表格中的循环来实现期望的结果，这将是一个很大的帮助。
哦.. 那么这很简单。让我马上补充答案。

标签： c# asp.net-mvc webgrid

【解决方案1】：

您想要的输出不是 webgrid 控件的正确用例。以下是使用简单 for 循环的 mvc razor 视图的表生成逻辑：

@model List<string>
<table >
            @{ 
                for (int i = 1; i <= Model.Count; i++)
                {
                    if (i % 2 != 0)
                    {
                        @:<tr >
                    }
                    <td style="border:solid;">
                            @Model[i - 1]
                    </td>

                     if (i % 2 == 0)
                     {
                         @:</tr>
                     }
                  }
              }
    </table>

我添加了一个 CSS 样式 style="border:solid;" 只是为了显示所有表格单元格的边框。您可以根据需要对其进行自定义。

此代码创建下表：

【讨论】：

感谢它真正帮助我的解决方案。
太棒了！如果此解决方案解决了您的问题，那么您可以通过单击投票按钮下方的绿色复选标记来接受该解决方案。这将有助于社区专注于本网站上未回答的问题。