Webgrid rows based on a collection in Model. MVC4

Question

I am trying to create a webgrid that will have rows of one column. The number of rows will depend upon the number of email addresses (strings) in the Model coming in. Here's the code of the view:

@model BarClients.Models.BarClientsViewModel

@{
    var grid = new WebGrid(Model.EmailAddressesOfChosenClient, ajaxUpdateContainerId:     "gridContent");
    int rowIndex = 0;

    if (Model.EmailAddressesOfChosenClient != null)
    {
        foreach (var email in Model.EmailAddressesOfChosenClient)
        {
            grid.Rows.Add(new WebGridRow(grid, email, rowIndex++));
        }        
    }
}


div id="gridContent"
@grid.GetHtml()
/div (arrows removed).

At @grid.GetHtml(), I am getting the error: A data source must be bound before this operation can be performed.

Is it even possible what I am trying to do? Many thanks.

score 2 · Accepted Answer · answered Jan 14 '14 at 16:44

You don't need to add the rows. They will be automatically generated when you call @grid.GetHtml().

This article shows you how to use the WebGrid and even improve it to be safely typed, if you want to.

The minimum code to render a grid looks like this:

@{
   var grid = new WebGrid(Model, defaultSort:"Name");
}

@grid.GetHtml()

Where Model is an IEnumerable<T> of objects, for example a List<T>. (Well there is a little bit more than the minimun: this will sort the grid by Name, and Name must be a property of the enumerated object).

Of course you can "fine-tune" it, by defining columns, formats and so on.

Please, if you think is the solution to the question, mark it as answer so that it can be useful for other people. — JotaBe, Jan 15 '14 at 11:12

Webgrid rows based on a collection in Model. MVC4

1 Answers1