docs(MultiSelect): add docs for custom values #2917

Tsvetomir-Hr · 2025-04-16T13:20:43Z

closes: https://github.com/telerik/blazor/issues/8693

ikoevska · 2025-04-17T08:28:23Z

components/multiselect/custom-value.md

+---
+title: Custom Value
+page_title: MultiSelect - Custom Value
+description: Custom values and user input in the MultiColumnComboBox for Blazor.


MultiColumnComboBox? Is this correct?

ikoevska · 2025-04-17T08:36:38Z

components/multiselect/custom-value.md

+
+# MultiSelect Custom Values
+
+The MultiSelect component allows the user to type in their own value that is not a part of the predefined set of options that the developer provided.


Suggested change

The MultiSelect component allows the user to type in their own value that is not a part of the predefined set of options that the developer provided.

The MultiSelect component lets users type their own values that are not part of the options predefined by the developer.

ikoevska · 2025-04-17T08:38:25Z

components/multiselect/custom-value.md

+
+The text entered by the user can still go into the field the combo box is bound to through two-way binding.
+
+To enable custom user input, set the `AllowCustom` parameter to `true`. When the user types a custom value, it will appear as the first item in the list with the label: `Use"typed value"`. Refer to the example below to see it in action.


Suggested change

To enable custom user input, set the `AllowCustom` parameter to `true`. When the user types a custom value, it will appear as the first item in the list with the label: `Use"typed value"`. Refer to the example below to see it in action.

To enable custom user input, set the `AllowCustom` parameter to `true`. When the user types a custom value, it appears as the first item in the list with the label: `Use"typed value"`. See the example below for details.

ikoevska · 2025-04-17T08:39:53Z

components/multiselect/custom-value.md

+
+To enable custom user input, set the `AllowCustom` parameter to `true`. When the user types a custom value, it will appear as the first item in the list with the label: `Use"typed value"`. Refer to the example below to see it in action.
+
+> When MultiSelect is bound to a model, the `TextField`, `ValueField` and the `Value` must be of type `string`. Otherwise an exception will be thrown. Strings are required because the user input can take any form and may not be parsable to other types (such as numbers or GUID).


Suggested change

> When MultiSelect is bound to a model, the `TextField`, `ValueField` and the `Value` must be of type `string`. Otherwise an exception will be thrown. Strings are required because the user input can take any form and may not be parsable to other types (such as numbers or GUID).

> When the MultiSelect is bound to a model, the `TextField`, `ValueField`, and `Value` must be of type `string`. Otherwise, an exception is thrown. Strings are required because user input can take any form and may not be parsable to other types (such as numbers or GUIDs).

ikoevska · 2025-04-17T08:40:49Z

components/multiselect/custom-value.md

+
+> When MultiSelect is bound to a model, the `TextField`, `ValueField` and the `Value` must be of type `string`. Otherwise an exception will be thrown. Strings are required because the user input can take any form and may not be parsable to other types (such as numbers or GUID).
+
+When custom input is allowed, the [ValueChanged event](slug:multiselect-events#valuechanged) fires on every keystroke, and not when an item is selected, because the MultiSelect component acts as a text input.


Suggested change

When custom input is allowed, the [ValueChanged event](slug:multiselect-events#valuechanged) fires on every keystroke, and not when an item is selected, because the MultiSelect component acts as a text input.

When custom input is allowed, the [`ValueChanged` event](slug://multiselect-events#valuechanged) fires on every keystroke instead of when an item is selected. This happens because the MultiSelect component behaves like a text input.

ikoevska · 2025-04-17T08:41:20Z

components/multiselect/custom-value.md

+
+## Limitations
+
+* `AllowCustom` is not compatible with [Adaptive rendering](slug:adaptive-rendering).


Suggested change

* `AllowCustom` is not compatible with [Adaptive rendering](slug:adaptive-rendering).

* `AllowCustom` is not compatible with [adaptive rendering](slug://adaptive-rendering).

What does this mean exactly? That MultiSelect with AllowCustom is not adaptive (is it adaptive when used with predefined values only)? Or something else?

ikoevska · 2025-04-17T08:42:44Z

components/multiselect/custom-value.md

+                    @bind-Value="@SelectedCities"
+                    TextField="@nameof(City.CityName)" ValueField="@nameof(City.CityName)"
+                    AllowCustom="true"
+                    Placeholder="Select city for the list or type a custom one"


Suggested change

Placeholder="Select city for the list or type a custom one"

Placeholder="Select a city for the list or type a custom one"

ikoevska · 2025-04-17T08:49:53Z

components/multiselect/custom-value.md

+
+The MultiSelect component allows the user to type in their own value that is not a part of the predefined set of options that the developer provided.
+
+The text entered by the user can still go into the field the combo box is bound to through two-way binding.


Is combo box correct here? (Just checking if it's a leftover from MultiColumnComboBox.)

docs(MultiSelect): add docs for custom values

647997b

Tsvetomir-Hr self-assigned this Apr 16, 2025

Tsvetomir-Hr requested review from a team as code owners April 16, 2025 13:20

ikoevska approved these changes Apr 17, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

docs(MultiSelect): add docs for custom values #2917

docs(MultiSelect): add docs for custom values #2917

Tsvetomir-Hr commented Apr 16, 2025

ikoevska Apr 17, 2025

ikoevska Apr 17, 2025

ikoevska Apr 17, 2025

ikoevska Apr 17, 2025

ikoevska Apr 17, 2025

ikoevska Apr 17, 2025

ikoevska Apr 17, 2025

ikoevska Apr 17, 2025

ikoevska Apr 17, 2025


		# MultiSelect Custom Values

		The MultiSelect component allows the user to type in their own value that is not a part of the predefined set of options that the developer provided.

	The MultiSelect component allows the user to type in their own value that is not a part of the predefined set of options that the developer provided.
	The MultiSelect component lets users type their own values that are not part of the options predefined by the developer.


		The text entered by the user can still go into the field the combo box is bound to through two-way binding.

		To enable custom user input, set the `AllowCustom` parameter to `true`. When the user types a custom value, it will appear as the first item in the list with the label: `Use"typed value"`. Refer to the example below to see it in action.


		To enable custom user input, set the `AllowCustom` parameter to `true`. When the user types a custom value, it will appear as the first item in the list with the label: `Use"typed value"`. Refer to the example below to see it in action.

		> When MultiSelect is bound to a model, the `TextField`, `ValueField` and the `Value` must be of type `string`. Otherwise an exception will be thrown. Strings are required because the user input can take any form and may not be parsable to other types (such as numbers or GUID).

	> When MultiSelect is bound to a model, the `TextField`, `ValueField` and the `Value` must be of type `string`. Otherwise an exception will be thrown. Strings are required because the user input can take any form and may not be parsable to other types (such as numbers or GUID).
	> When the MultiSelect is bound to a model, the `TextField`, `ValueField`, and `Value` must be of type `string`. Otherwise, an exception is thrown. Strings are required because user input can take any form and may not be parsable to other types (such as numbers or GUIDs).


		> When MultiSelect is bound to a model, the `TextField`, `ValueField` and the `Value` must be of type `string`. Otherwise an exception will be thrown. Strings are required because the user input can take any form and may not be parsable to other types (such as numbers or GUID).

		When custom input is allowed, the [ValueChanged event](slug:multiselect-events#valuechanged) fires on every keystroke, and not when an item is selected, because the MultiSelect component acts as a text input.

	When custom input is allowed, the [ValueChanged event](slug:multiselect-events#valuechanged) fires on every keystroke, and not when an item is selected, because the MultiSelect component acts as a text input.
	When custom input is allowed, the [`ValueChanged` event](slug://multiselect-events#valuechanged) fires on every keystroke instead of when an item is selected. This happens because the MultiSelect component behaves like a text input.


		## Limitations

		* `AllowCustom` is not compatible with [Adaptive rendering](slug:adaptive-rendering).

	Placeholder="Select city for the list or type a custom one"
	Placeholder="Select a city for the list or type a custom one"

docs(MultiSelect): add docs for custom values #2917

Are you sure you want to change the base?

docs(MultiSelect): add docs for custom values #2917

Conversation

Tsvetomir-Hr commented Apr 16, 2025

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment