asp.net-mvckendo-uikendo-tabstrip

kendo tabstrip ArgumentOutOfRangeException


I use the kendo tab strip and try to show a tab for each item of a model collection.

@if (Model.Entities.Count > 1)
{
    @(Html.Kendo().TabStrip()
        .Name("tabstrip")
        .Items(items =>
        {
            for (int i = 0; i < Model.Entities.Count; i++)
            {
                items.Add()
                    .Text(Model.Entities[i].Name)
                    .Selected(i == 0)
                    .Content(@<div>
                                @Model.Entities[i].Name //causes exception
                            </div>
                            );
            }
        })
    )
}

The markup in the tab content (@Model.Entities[i].Name) causes an exception.

ArgumentOutOfRangeException: Index was out of range. Must be non-negative and less than the size of the collection. Parameter name: index

Does anyone know what I am doing wrong or how to implement it correctly?


Solution

  • You encountered the outer variable trap.

    This worked for me:

    @if (Model.Entities.Count > 1)
    {
        @(Html.Kendo().TabStrip()
            .Name("tabstrip")
            .Items(items =>
            {
                for (int i = 0; i < Model.Entities.Count; i++)
                {
                    var i1 = i;
                    items.Add()
                        .Text(Model.Entities[i].Name)
                        .Selected(i == 0)
                        .Content(@<div>
                                    @Model.Entities[i1].Name 
                                </div>
                                );
                }
            })
        )
    }