开发者

MVC 3 - Display collection of items in rows

I have a collection that I'm displaying, like so:

@foreach (var employee in Model.Employees)
{
    <a href="#">@employee.Name</a开发者_高级运维>
}

This just displays everything in one long row. I'd like to display the collection in rows of 3, so that I have 3 items displayed, break to a new line, the next 3 items displayed, another break to a new line, and so on.

Is there a simple way to do this?


Mystere Man is right, and I typically use list items as the semantic markup elements for collections of links.

<ul>
@foreach (var employee in Model.Employees)
{
    <li><a href="#">@employee.Name</a></li>
}
</ul>

Then use CSS styling to make your list look how you want it to use (no bullet points, etc.) If you make the ul have a fixed with, and each li inside of each have a width of 1/3 of that, then make the lis show up as inline blocks, that ought to give you what you're going for. (jsfiddle)


This has nothing to do with MVC, it's an HTML problem. You need to render HTML to make it do what you want. Look at the rendered output.

Typically you would wrap rows in divs or other elements in order to create the semantic markup you want.


not using css, here's a simpleish way of doing this.

@{ var i = 0; }
@foreach (var employee in Model.Employees)
{
    @{ i++; } 
    <a href="#">@employee.Name</a>
    @if(i%3 == 2)
    {
        <br/>
    }
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜