RadMultiSelect
Provides an input that lets users search for and select multiple values (tags). Renders selected items as removable tokens and supports binding to server or client (web service) data sources.
Main scenarios: multi-value field editors (e.g., Skills, Categories, Countries), tagging interfaces, quick filters.
Data binding options:
- Server-side (standard ASP.NET data binding via DataSource / DataSourceID).
- Client-side (web service) via WebServiceClientDataSource for lightweight paging or remote filtering.
Selection + validation: combine CausesValidation with ValidationGroup for form validation on postback.
Templating & custom attributes: use
item.Attributes["data-x"] = "val"and declared DataKeyNames to expose extra bound fields in templates.Performance tips:
- Limit initial item count when large datasets are expected; prefer lazy client binding.
- Use virtualization settings (see
VirtualSettingsin the other partial) for large lists to avoid rendering all DOM nodes.Related core members: Items, CausesValidation, ValidationGroup, DataKeyNames.
Definition
Namespace:Telerik.Web.UI
Assembly:Telerik.Web.UI.dll
Syntax:
[ValidationProperty("Text")]
[ControlValueProperty("Value")]
[TelerikToolboxCategory("Data Editing")]
[ToolboxBitmap(typeof(RadMultiSelect), "Toolbox.Icons.MultiSelect.png")]
[RequiredScript(typeof(jQueryPlugins))]
[RequiredScript(typeof(Html5MultiSelect))]
[ClientScriptResource("Telerik.Web.UI.RadMultiSelect", "Telerik.Web.UI.MultiSelect.Scripts.RadMultiSelect.js")]
[EmbeddedSkin("MultiSelect", typeof(RadMultiSelect))]
[EmbeddedSkin("MultiSelect", "Default", typeof(RadMultiSelect))]
[RequiredCss("Telerik.Web.UI.Skins.Common.common.css", RenderMode.Classic, typeof(RadMultiSelect))]
[RequiredCss("Telerik.Web.UI.Skins.Common.common.css", RenderMode.Lightweight, typeof(RadMultiSelect))]
[RequiredCss("Telerik.Web.UI.Skins.Common.common.css", RenderMode.Mobile, typeof(RadMultiSelect))]
[RequiredCss("Telerik.Web.UI.Skins.Common.fonticons.css", RenderMode.Classic, typeof(RadMultiSelect))]
[RequiredCss("Telerik.Web.UI.Skins.Common.fonticons.css", RenderMode.Lightweight, typeof(RadMultiSelect))]
[RequiredCss("Telerik.Web.UI.Skins.Common.fonticons.css", RenderMode.Mobile, typeof(RadMultiSelect))]
public class RadMultiSelect : RadDataBoundControl, IComponent, IDisposable, IParserAccessor, IUrlResolutionService, IDataBindingsAccessor, IControlBuilderAccessor, IControlDesignerAccessor, IExpressionsAccessor, IAttributeAccessor, IScriptControl, IControlResolver, IPostBackDataHandler, ISkinnableControl, IControl, IFeatureGroup, INamingContainerInheritance: objectControlWebControlBaseDataBoundControlDataBoundControlRadDataBoundControlRadMultiSelect...
Implements:
Inherited Members
Constructors
public RadMultiSelect()Fields
protected StringBuilder dataBindDataProperties
Configures the opening and closing animations of the suggestion popup. Setting the animation option to false will disable the opening and closing animations. As a result the suggestion popup will open and close instantly. is not a valid configuration.
public bool Animation { get; set; }Configures the opening and closing animations of the suggestion popup. Setting the animation option to false will disable the opening and closing animations. As a result the suggestion popup will open and close instantly. is not a valid configuration.
[PersistenceMode(PersistenceMode.InnerProperty)]
public Animation AnimationSettings { get; }Controls whether to bind the widget to the data source on initialization
public bool AutoBind { get; set; }Controls whether to close the widget suggestion list on item selection.
public bool AutoClose { get; set; }Gets or sets a value indicating whether a postback to the server automatically occurs when the user changes the RadComboBox selection.
[Bindable(false)]
public bool AutoPostBack { get; set; }Set this property to true if the server needs to capture the selection as soon as it is made. For example, other controls on the Web page can be automatically filled depending on the user's selection from a list control.
This property can be used to allow automatic population of other controls on the Web page based on a user's selection from a list.
The value of this property is stored in view state.
If set to true, the widget automatically adjusts the width of the popup element and does not wrap up the item label.
public bool AutoWidth { get; set; }Use it to set the Id of the parent MultiSelect widget.Help topic showing how cascading functionality works
public string CascadeFrom { get; set; }Defines the field to be used to filter the data source. If not defined the parent's dataValueField option will be used.Help topic showing how cascading functionality works
public string CascadeFromField { get; set; }Defines the parent field to be used to retain value from. This value will be used further to filter the dataSource. If not defined the value from the parent's dataValueField will be used.
public string CascadeFromParentField { get; set; }Gets or sets a value indicating whether validation is performed when an item within the control is selected.
public virtual bool CausesValidation { get; set; }true if validation is performed when an item is selected; otherwise, false. The default value is true.
By default, page validation is performed when an item is selected. Page validation determines whether the input controls associated with a validation control on the page all pass the validation rules specified by the validation control. You can specify or determine whether validation is performed on both the client and the server when an item is clicked by using the CausesValidation property. To prevent validation from being performed, set the CausesValidation property to false.
Unless this options is set to false, a button will appear when hovering the widget. Clicking that button will reset the widget's value and will trigger the change event.
public bool ClearButton { get; set; }Defines the client events handlers.
[PersistenceMode(PersistenceMode.InnerProperty)]
public MultiSelectClientEvents ClientEvents { get; }The CssClass property will now be used instead of the former Skin and will be modified in AddAttributesToRender()
protected override string CssClassFormatString { get; }Overrides:
Gets or sets an array of data-field names that will be used to populate the MultiSelect's DataItem property which is used to populated the control's template. The field declared in the Columns are added by default.
[SuppressMessage("Microsoft.Performance", "CA1819:PropertiesShouldNotReturnArrays")]
[TypeConverter(typeof(ListConverter))]
[PersistenceMode(PersistenceMode.Attribute)]
public virtual string[] DataKeyNames { get; set; }An array that contains the names of the fields contained in the MultiSelect's DataItem property.
Note: The dataItem's properties declared in the template should be with lower case.
The field of the data item that provides the text content of the list items. The widget will filter the data source based on this field.
public string DataTextField { get; set; }The field of the data item that provides the value of the widget.
public string DataValueField { get; set; }Specifies the delay in milliseconds after which the MultiSelect will start filtering dataSource.
public double Delay { get; set; }The height of the suggestion popup in pixels. The default value is 200 pixels.
[ClientControlProperty]
[ClientPropertyName("height")]
public Unit DropDownHeight { get; set; }If set to false the widget will be disabled and will not allow user input. The widget is enabled by default and allows user input.
[Obsolete("This property is becoming obsolete in favor the inherited WebControl.Enabled property. Therefore, please, use .Enabled instead.", false)]
public bool Enable { get; set; }If set to true the widget will not show all items when the text of the search input cleared. By default the widget shows all items when the text of the search input is cleared. Works in conjunction with minLength.
public bool EnforceMinLength { get; set; }The filtering method used to determine the suggestions for the current value. Filtration is turned of by default, and can be performed over string values only (either the widget's data has to be an array of strings, or over the field, configured in the dataTextField option). The supported filter values are startswith, endswith and contains.
[Bindable(false)]
[ClientControlProperty]
[ClientPropertyName("filter")]
public RadMultiSelectFilter Filter { get; set; }The template used to render the fixed header group. By default the widget displays only the value of the current group.
[Browsable(true)]
[Bindable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
public string FixedGroupTemplate { get; set; }The template used to render the footer template. The footer template receives the widget itself as a part of the data argument. Use the widget fields directly in the template.
[Browsable(true)]
[Bindable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
public string FooterTemplate { get; set; }The template used to render the groups. By default the widget displays only the value of the group.
[Browsable(true)]
[Bindable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
public string GroupTemplate { get; set; }Specifies a static HTML content, which will be rendered as a header of the popup element.
[Browsable(true)]
[Bindable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
public string HeaderTemplate { get; set; }If set to true the first suggestion will be automatically highlighted.
public bool HighlightFirst { get; set; }If set to false case-sensitive search will be performed to find suggestions. The widget performs case-insensitive searching by default.
public bool IgnoreCase { get; set; }[PersistenceMode(PersistenceMode.InnerProperty)]
public virtual MultiSelectItemCollection Items { get; }The template used to render the items in the popup list.
[Browsable(true)]
[Bindable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
public string ItemTemplate { get; set; }Defines the limit of the selected items. If set to null widget will not limit number of the selected items.
public double MaxSelectedItems { get; set; }The text messages displayed in the widget. Use this option to customize or localize the messages.
[PersistenceMode(PersistenceMode.InnerProperty)]
public Messages MessagesSettings { get; }The minimum number of characters the user must type before a search is performed. Set to a higher value if the search could match a lot of items. A zero value means that a request will be made as soon as the user focuses the widget.
public double MinLength { get; set; }The template used to render the "no data" template, which will be displayed if no results are found or the underlying data source is empty. The noData template receives the widget itself as a part of the data argument. The template will be evaluated on every widget data bound.
[Browsable(true)]
[Bindable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
public string NoDataTemplate { get; set; }The hint displayed by the widget when it is empty. Not set by default.
public string Placeholder { get; set; }The options that will be used for the popup initialization. For more details about the available options refer to Popup documentation.
[PersistenceMode(PersistenceMode.InnerProperty)]
public Popup PopupSettings { get; }Gets or sets the URL of the page to post to from the current page when a tab from the tabstrip is clicked.
[Themeable(false)]
public virtual string PostBackUrl { get; set; }The URL of the Web page to post to from the current page when a tab from the tabstrip control is clicked. The default value is an empty string (""), which causes the page to post back to itself.
protected override HtmlTextWriterTag TagKey { get; }Overrides:
The mode used to render the selected tags. The available modes are: - multiple - renders a tag for every selected value - single - renders only one tag that shows the number of the selected values
[Bindable(false)]
[ClientControlProperty]
[ClientPropertyName("tagMode")]
public RadMultiSelectTagMode TagMode { get; set; }The template used to render the tags.
[Browsable(true)]
[Bindable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
public string TagTemplate { get; set; }Gets the unique, hierarchically qualified identifier for the server control.
[ClientControlProperty]
[ClientPropertyName("_uniqueId")]
public override string UniqueID { get; }The fully qualified identifier for the server control.
Overrides:
Gets or sets the name of the validation group to which this validation control belongs.
[Bindable(true)]
public virtual string ValidationGroup { get; set; }The name of the validation group to which this validation control belongs. The default is an empty string (""), which indicates that this property is not set.
This property works only when CausesValidation is set to true.
The value of the widget.
[Browsable(false)]
[Bindable(true, BindingDirection.TwoWay)]
public IEnumerable<object> Value { get; set; }Specifies the value binding behavior for the widget. If set to true, the View-Model field will be updated with the selected item value field. If set to false, the View-Model field will be updated with the selected item.
public bool ValuePrimitive { get; set; }Enables the virtualization feature of the widget. The configuration can be set on an object, which contains two properties - itemHeight and valueMapper.For detailed information, refer to the article on virtualization.
public bool Virtual { get; set; }Enables the virtualization feature of the widget. The configuration can be set on an object, which contains two properties - itemHeight and valueMapper.For detailed information, refer to the article on virtualization.
[PersistenceMode(PersistenceMode.InnerProperty)]
public Virtual VirtualSettings { get; }Gets the RadClientDataSource instance of the MultiSelect control.
[Browsable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
public virtual WebServiceClientDataSource WebServiceClientDataSource { get; }Methods
protected virtual void BindItems(IEnumerable<MultiSelectItem> items)protected override void CreateChildControls()Overrides:
protected override void DescribeComponent(IScriptDescriptor descriptor)Overrides:
protected virtual void DescribeItems(IScriptDescriptor descriptor)Loads the posted content of the list control, if it is different from the last posting.
protected override bool LoadPostData(string postDataKey, NameValueCollection postCollection)The key identifier for the control, used to index the postCollection.
postCollectionNameValueCollectionA NameValueCollection that contains value information indexed by control identifiers.
Returns:true if the posted content is different from the last posting; otherwise, false.
Overrides:
protected virtual void OnChildrenCreated()Raises the OnItemDeselected event. This allows you to handle the event directly.
Raises the OnItemSelected event. This allows you to handle the event directly.
Raises the OnItemSelected event. This allows you to handle the event directly.
protected virtual void OnSelectionChanged()protected override void PerformDataBinding(IEnumerable data)Overrides:
protected virtual void RaiseItemDeselectedEvent(MultiSelectItem args)protected virtual void RaiseItemSelectedEvent(MultiSelectItem args)Signals the RadMultiSelect control to notify the ASP.NET application that the state of the control has changed.
protected override void RaisePostDataChangedEvent()Overrides:
protected virtual void RaiseSelectionChangedEvent()protected override void RenderContents(HtmlTextWriter writer)Overrides:
public override void RenderEndTag(HtmlTextWriter writer)Overrides:
protected override void TrackViewState()Overrides:
Events
Occurs after an item is data bound to the RadComboBox control.
public event RadMultiSelectItemEventHandler ItemDataBoundThis event provides you with the last opportunity to access the data item before it is displayed on the client. After this event is raised, the data item is nulled out and no longer available.
public event RadMultiSelectItemEventHandler ItemDeselectedpublic event RadMultiSelectItemEventHandler ItemSelectedpublic event RadMulitSelectSeletionChangedEventHandler SelectionChanged