# Binding

When using the helpers, you can bind the checkbox items by using the [Items()](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/editors/checkboxgroup/binding#items-method) method or the [BindTo()](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/editors/checkboxgroup/binding#bindto-method) method.

## Items Method

The example below demonstrates how to use the Items() method to configure the checkboxes in the CheckBoxGroup widget.

```Razor HtmlHelper
    @(Html.Kendo().CheckBoxGroup()
        .Name("checkboxgroup")
        .Items(i =>
        {
            i.Add().Label("English").Value("1");
            i.Add().Label("Spanish").Value("2");
            i.Add().Label("Russian").Value("3");
        })
        .Value(new string[] { "1" })
    )
```

## BindTo Method

You can configure the items in the CheckBoxGroup widget by using the BindTo method.

1. Pass the data to the view through the view model.

   ```
    public ActionResult Index()
    {
        var itemsList = new List<InputGroupItemModel>()
        {
            new InputGroupItemModel()
            {
                Label = "Yes",
                Value = "one"
            },
             new InputGroupItemModel()
            {
                Label = "No",
                Value = "two"
            },
              new InputGroupItemModel()
            {
                Label = "N/A",
                Value = "three"
            }
        };

        return View(new CheckBoxGroupViewModel() { Items = itemsList, CheckBoxGroupValue = new string[] { "two" }  });
    }

    public class CheckBoxGroupViewModel
    {
        public List<InputGroupItemModel> Items { get; set; }

    	public string[] CheckBoxGroupValue { get; set; }
    }
    
    public class InputGroupItemModel : IInputGroupItem
    {
    	public IDictionary<string, object> HtmlAttributes { get; set; }

    	public string CssClass { get; set; }

    	public bool? Enabled { get; set; }

    	public bool? Encoded { get; set; }

    	public string Label { get; set; }

    	public string Value { get; set; }
    }
   ```

2. Add the CheckBoxGroup to the view and bind it to a property of the view model.

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

       @(Html.Kendo().CheckBoxGroup()
           .Name("checkboxgroup")
           .BindTo(Model.Items)
   		.Value(Model.CheckBoxGroupValue)
       )
   ```

## Model Binding

You can implement model binding both with [local](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/editors/checkboxgroup/binding#items-method) and [remote data](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/editors/checkboxgroup/binding#bindto-method).

> The CheckBoxGroup component is not accustomed to complex object-binding scenarios.

### Model Binding with Local Data

```Razor HtmlHelper
    @model CheckBoxGroupModel

    @(Html.Kendo().CheckBoxGroupFor(model => model.CheckBoxGroupValue)
        .Name("checkboxgroup")
        .Items(i =>
        {
            i.Add().Label("English").Value("1");
            i.Add().Label("Spanish").Value("2");
            i.Add().Label("Russian").Value("3");
        })
    )
```

```C# Controller
    public ActionResult Index()
    {
        var model = new CheckBoxGroupModel
        {
            CheckBoxGroupValue = new List<string>() { "1" }
        };  

        return View(model);
    }
```

```C# Model
    public class CheckBoxGroupModel
    {
        public string[] CheckBoxGroupValue { get; set; }
    }
```

### Model Binding with Remote Data

```Razor HtmlHelper
    @model CheckBoxGroupModel

    @(Html.Kendo().CheckBoxGroupFor(model => model.CheckBoxGroupValue)
         .HtmlAttributes(new { style = "height: auto;" })
         .Layout(CheckBoxGroupLayout.Vertical)
         .BindTo((List<CheckBoxGroupModel>)ViewData["CheckBoxGroupItems"])
    )
```

```C# Controller
        private List<InputGroupItemModel> GetCheckBoxGroupItems()
         => new List<InputGroupItemModel>()
            {
                new InputGroupItemModel()
                {
                    Label = "Yes",
                    Value = "one"
                },
                 new InputGroupItemModel()
                {
                    Label = "No",
                    Value = "two"
                },
                  new InputGroupItemModel()
                {
                    Label = "N/A",
                    Value = "three"
                }
            };

        public ActionResult Index()
        {
            var model = new CheckBoxGroupModel
            {
                CheckBoxGroupValue = new List<string>() { "one" }
            };

            ViewData["CheckBoxGroupItems"] = GetCheckBoxGroupItems();

            return View(model);
        }
```

```C# Model
    public class CheckBoxGroupModel
    {
        public string[] CheckBoxGroupValue { get; set; }
    }
```

## See Also

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