Chip

Example

Razor
<kendo-chip>
</kendo-chip>

Attributes

AttributeTypeDescription
nameStringSets the name of the component.
as-moduleBoolean
is-in-client-templateBooleanWhen placing a Tag Helper within a Kendo Template, set the type to text/html and add the is-in-client-template="true" attribute.
avatar-classStringIf set, value will be appended to the icon's element class attribute. It also appends "k-chip avatar" and "k-avatar" classes to the icon's element.
enabledBooleanToggles the enabled state of the Chip.
fill-modeChipFillModeSets a value controlling how the color is applied.
html-attributesIDictionary<String,Object>Defines custom attributes of the Chip's element.
iconStringDefines the name for an existing icon in a Kendo UI theme or SVG content. The icon is rendered inside the chip by a span.k-icon or span.k-svg-icon element.See web font icons help article for more details on Kendo UI icons.
icon-classStringIf set, value will be appended to the icon's element class attribute.
labelStringThe label text of the chip. Default is empty string.
deferredBooleanSuppress initialization script rendering. Note that this options should be used in conjunction with DeferredScripts method.
on-clickStringFires when the user clicks the content of the Chip or activates it with the Enter or Space keys.
on-removeStringFires when the user clicks the remove icon of the Chip. After this event, the Chip will not remove itself.
on-selectStringFires when the selection of a selectable the Chip toggles.
removableBooleanSpecifies if the Chip will be removable or not. If the property is set to true, the Chip renders a remove icon.
remove-iconStringDefines the name for an existing icon in a Kendo UI theme or SVG content for the remove button when removable=true. The icon is rendered inside the chip by a span.k-icon or span.k-svg-icon element.See web font icons help article for more details on Kendo UI icons.
remove-icon-classStringIf set, value will be appended to the remove icon's element class attribute.
roundedRoundedSets a value controlling the border radius.
script-attributesIDictionary<String,Object>
selectableBooleanSets whether the Chip can be selected.
selectedBooleanToggles the selected state of the Chip.
sizeComponentSizeSets the size of the component.
theme-colorChipThemeColorSets the color of the component according to the applied theme.
In this article
ExampleAttributes
Not finding the help you need?
Contact Support