# Select All

The Telerik UI MultiSelect for ASP.NET Core provides a built-in Select All feature that renders a sticky header at the top of the dropdown list. Clicking the header selects or deselects all items. When combined with the [`Checkboxes`](https://www.telerik.com/aspnet-core-ui/documentation/api/kendo.mvc.ui.fluent/multiselectbuilder#checkboxes) option, the header displays a checkbox that reflects the aggregate selection state—unchecked (none selected), indeterminate (some selected), or checked (all selected).

## Basic Configuration

To enable the Select All header, call the [`SelectAll()`](https://www.telerik.com/aspnet-core-ui/documentation/api/kendo.mvc.ui.fluent/multiselectbuilder#selectall) method. The following example also enables checkboxes and filtering:

```Razor HtmlHelper
    @(Html.Kendo().MultiSelect()
          .Name("products")
          .Placeholder("Select products...")
          .SelectAll()
          .Checkboxes()
          .Filter(FilterType.Contains)
          .DataTextField("ProductName")
          .DataValueField("ProductID")
          .DataSource(source =>
          {
              source.Read(read =>
              {
                  read.Action("SelectAll_GetProducts", "MultiSelect");
              });
          })
    )
```

```Razor TagHelper
    <kendo-multiselect name="products"
                       placeholder="Select products..."
                       select-all="true"
                       checkboxes="true"
                       filter="FilterType.Contains"
                       datatextfield="ProductName"
                       datavaluefield="ProductID">
        <datasource type="DataSourceTagHelperType.Custom">
            <transport>
                <read url="@Url.Action("SelectAll_GetProducts", "MultiSelect")" />
            </transport>
        </datasource>
    </kendo-multiselect>
```

okay no

## Select All with Filtering

When filtering is active, clicking the Select All header selects all items from the data source—not only the visible subset. After the selection completes, the filter is cleared.

```Razor HtmlHelper
    @(Html.Kendo().MultiSelect()
          .Name("products")
          .Placeholder("Filter and select all matching...")
          .SelectAll()
          .Checkboxes()
          .Filter(FilterType.Contains)
          .DataTextField("ProductName")
          .DataValueField("ProductID")
          .DataSource(source =>
          {
              source.Read(read =>
              {
                  read.Action("SelectAll_GetProducts", "MultiSelect");
              });
          })
          .Value(new[] { 1, 2, 3 })
    )
```

```Razor TagHelper
    <kendo-multiselect name="products"
                       placeholder="Filter and select all matching..."
                       select-all="true"
                       checkboxes="true"
                       filter="FilterType.Contains"
                       datatextfield="ProductName"
                       datavaluefield="ProductID"
                       value='new int[] { 1, 2, 3 }'>
        <datasource type="DataSourceTagHelperType.Custom">
            <transport>
                <read url="@Url.Action("SelectAll_GetProducts", "MultiSelect")" />
            </transport>
        </datasource>
    </kendo-multiselect>
```

## Customizing the Select All Label

To change the text displayed in the sticky header, use the [`Messages.SelectAll`](https://www.telerik.com/aspnet-core-ui/documentation/api/kendo.mvc.ui.fluent/multiselectmessagessettingsbuilder#selectallsystemstring) option.

```Razor HtmlHelper
    @(Html.Kendo().MultiSelect()
          .Name("products")
          .SelectAll()
          .Checkboxes()
          .Messages(m => m.SelectAll("Check All Items"))
          .DataTextField("ProductName")
          .DataValueField("ProductID")
          .DataSource(source =>
          {
              source.Read(read =>
              {
                  read.Action("SelectAll_GetProducts", "MultiSelect");
              });
          })
    )
```

```Razor TagHelper
    <kendo-multiselect name="products"
                       select-all="true"
                       checkboxes="true"
                       datatextfield="ProductName"
                       datavaluefield="ProductID">
        <messages select-all="Check All Items" />
        <datasource type="DataSourceTagHelperType.Custom">
            <transport>
                <read url="@Url.Action("SelectAll_GetProducts", "MultiSelect")" />
            </transport>
        </datasource>
    </kendo-multiselect>
```

## Handling the SelectAllChange Event

The `SelectAllChange` event fires when the user clicks the Select All header. The event is preventable—calling `e.preventDefault()` cancels the built-in selection logic so you can implement custom behavior.

```Razor HtmlHelper
    @(Html.Kendo().MultiSelect()
          .Name("products")
          .SelectAll()
          .Checkboxes()
          .DataTextField("ProductName")
          .DataValueField("ProductID")
          .DataSource(source =>
          {
              source.Read(read =>
              {
                  read.Action("SelectAll_GetProducts", "MultiSelect");
              });
          })
          .Events(e => e.SelectAllChange("onSelectAllChange"))
    )

    <script>
        function onSelectAllChange(e) {
            if (e.checked) {
                console.log("Selecting all items");
            } else {
                console.log("Deselecting all items");
            }
        }
    </script>
```

```Razor TagHelper
    <kendo-multiselect name="products"
                       select-all="true"
                       checkboxes="true"
                       datatextfield="ProductName"
                       datavaluefield="ProductID"
                       on-select-all-change="onSelectAllChange">
        <datasource type="DataSourceTagHelperType.Custom">
            <transport>
                <read url="@Url.Action("SelectAll_GetProducts", "MultiSelect")" />
            </transport>
        </datasource>
    </kendo-multiselect>

    <script>
        function onSelectAllChange(e) {
            if (e.checked) {
                console.log("Selecting all items");
            } else {
                console.log("Deselecting all items");
            }
        }
    </script>
```

## See Also

* [Select All in the MultiSelect (Demo)](https://demos.telerik.com/aspnet-core/multiselect/select-all)
* [Summary-Tag Mode](https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/editors/multiselect/tag-mode)
* [Server-Side API Reference of the MultiSelect](https://www.telerik.com/aspnet-core-ui/documentation/api/multiselect)
