asp.net-mvc-3 - 如何在没有 javascript 的情况下在 MVC-Razor 中使用 rowspan？

Question

如何在 Razor View 中使用 rowspan 合并表格中的单元格？

• 不使用 javascript/jQuery。
• 表格的来源是一个 IEnumerable。
• 源中的某些项目在特定字段中具有相同的值，而这些正是我们要合并到一个单元格中的项目。
• 我们不知道给定值重复了多少次。

生成的 HTML 应该是这样的:

<table>
    <tr>
        <td rowspan="2">Column 1 row 1</td>
        <td>Column 2 row 1</td>
    </tr>
    <tr>
        <td>Column 2 row 2</td>
    </tr>
    <tr>
        <td rowspan="3">Column 1 row 3</td>
        <td>Column 2 row 3</td>
    </tr>
    <tr>
        <td>Column 2 row 4</td>
    </tr>
    <tr>
        <td>Column 2 row 5</td>
    </tr>
</table>

编辑以添加数据源和所需结果:

数据源可能类似于带有类别的产品。例如:

类别

• 电子
• 杂货

产品

• 笔记本电脑(电子)
• iPod(电子)
• 电视(电子)
• 咖啡(杂货)
• Cookie(杂货)

结果

╔═════════════╦════════╗
║ Electronics ║ Laptop ║
║             ║ iPod   ║
║             ║ TV     ║
╠═════════════╬════════╣
║ Groceries   ║ Coffee ║
║             ║ Cookies║ 
╚═════════════╩════════╝

我想到的唯一方法是使用 Linq 来计算某个值在列表中出现的次数，但我想知道是否有人有更好的解决方案。谢谢!

Answer 1

尝试这样的事情。

<table>
    <tr>
        <th>Movie</th>
        <th>Person</th>
    </tr>

    @foreach (var byMovies in elements.GroupBy(x => x.Movie)
                                      .OrderBy(movie => movie.Key.Name))
    {
        var secondRowOrHigher = false;
        @:<tr>
        @:<td rowspan="@byMovies.Count()">@byMovies.Key.Name</td>

        foreach (var ticket in byMovies.OrderBy(x => x.Person.Name))
        {
            if (secondRowOrHigher)
            {
                @:<tr>
            }
            secondRowOrHigher = true;

            <td>@ticket.Person.Name</td>
            @:</tr>
        }
    }
</table>

和类只是为了拍照

public class TicketInfo
{
    public Movie Movie { get; set; }
    public Person Person { get; set; }
}

public class Person
{
    public string Name { get; set; }
}

public class Movie
{
    public string Name { get; set; }
}