# OData Binding

Develop powerful and lightweight web applications using ASP.NET MVC controls. Learn more about the ComponentOne MVC controls in ASP.NET MVC documentation.

## Content



OData model is a server-side model which provides the complete data at the server side. To apply OData binding in FlexGrid, you need to specify the service url, table name, and keys property. This topic describes how to add data to FlexGrid using OData binding.

The following image shows how the FlexGrid control appears after implementing the code below.

![](https://cdn.mescius.io/document-site-files/images/2b3ac322-100e-4637-958d-fb40dcda3f44/images/odatabinding.png)

**Controller Code**

```razor
// GET: FlexGrid
public ActionResult Index()
{
    return View();
}
```

**View Code**

```razor
@(Html.C1().FlexGrid()
        .Id("ODataBinding")
        .IsReadOnly(true)
        .AllowAddNew(false)
        .AllowDelete(false)
        .CssStyle("height", "300px")
        .AutoGenerateColumns(false)
        .BindODataSource(odsb =>
                            odsb.ServiceUrl("https://services.odata.org/Northwind/Northwind.svc")
                            .TableName("Products")
                            .Keys("ProductID"))
        .Columns(csb =>
        {
            csb.Add(cb => cb.Binding("ProductID").Width("*"));
            csb.Add(cb => cb.Binding("ProductName").Width("*"));
            csb.Add(cb => cb.Binding("QuantityPerUnit").Width("*"));
            csb.Add(cb => cb.Binding("UnitsInStock").Width("*"));
        })
        .Filterable(fb => fb.DefaultFilterType(FilterType.Both)))
```