DotVVM Tip 02: Repeater control

DotVVM Tips is a series of short articles showing interesting features of DotVVM. To learn more, visit our Docs site.

DotVVM syntax is different from Razor. Instead of foreach blocks, use the Repeater control and bind it to a collection of objects.

// Razor
<ul>
    @foreach (var topping in pizza.Toppings)
    {
        <li>+ @topping.Name</li>
    }
</ul>

// DotVVM
<dot:Repeater DataSource="{value: Toppings}"
              WrapperTagName="ul">
    <li>+ {{value: Name}}</li>
</dot:Repeater> 

You can use the WrapperTagName property to control the wrapper element. Also, there is the RenderWrapperTag property which can remove the wrapper element completely.

Be careful when generating rows in tables – the best way is to set WrapperTagName to tbody element. If you set it to the table, the browser can mess things up as it will generate the tbody element itself. Or you can just use GridView.