# Model Binding

You can implement model binding in the ComboBox with both [local data](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/editors/combobox/binding/model-binding#local-data) and [remote data](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/editors/combobox/binding/model-binding#remote-data).

## Local Data

Local data is the data that is available on the client when the ComboBox is initialized.

1. Pass the data to the view through `ViewData`.

   ```
    public ActionResult Index()
    {
        ViewData["products"] = GetProducts();

        return View(new ProductViewModel
        {
            ProductID = 4,
            ProductName = "ProductName4"
        });
    }

    private static IEnumerable<ProductViewModel> GetProducts()
    {
        var products = Enumerable.Range(0, 2000).Select(i => new ProductViewModel
        {
            ProductID = i,
            ProductName = "ProductName" + i
        });

        return products;
    }
   ```

2. Add the ComboBox to the view and bind it to the data that is saved in the `ViewData`.

```Razor HtmlHelper
    @model MvcApplication1.Models.ProductViewModel

    @(Html.Kendo().ComboBoxFor(m => m.ProductID)
        .DataValueField("ProductID")
        .DataTextField("ProductName")
        .BindTo((System.Collections.IEnumerable)ViewData["products"])
    )
```

## Remote Data

You can configure the ComboBox to get its data from a remote source by making an AJAX request.

1. Create an action that returns the data as a JSON result.

   ```
    public ActionResult Index()
    {
        return View(new ProductViewModel
        {
            ProductID = 4,
            ProductName = "ProductName4"
        });
    }
    
    public JsonResult GetProductsAjax()
    {
        var products = Enumerable.Range(0, 500).Select(i => new ProductViewModel
        {
            ProductID = i,
            ProductName = "ProductName" + i
        });

        return Json(products, JsonRequestBehavior.AllowGet);
    }
    
   ```

2. Add the ComboBox to the view and configure its DataSource to use remote data.

```Razor HtmlHelper
    @model MvcApplication1.Models.ProductViewModel


    @(Html.Kendo().ComboBoxFor(m => m.ProductID)
        .Filter("contains")
        .DataTextField("ProductName")
        .DataValueField("ProductID")
        .Placeholder("Select product...")
        .DataSource(source =>
        {
            source.Read(read =>
            {
                read.Action("GetProductsAjax", "Home");
            })
            .ServerFiltering(false);
        })
    )
```

## See Also

* [Server-Side API](https://www.telerik.com/aspnet-mvc/documentation/api/combobox)