Badge

Example

Razor
<kendo-badge>
</kendo-badge>

Attributes

AttributeTypeDescription
nameStringSets the name of the component.
as-moduleBooleanSpecifies whether the initialization script of the component will be rendered as a JavaScript module.
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.
alignBadgeAlignDefines the alignment of the badge
deferredBooleanSuppress initialization script rendering. Note that this options should be used in conjunction with DeferredScripts method.
cutout-borderBooleanSpecifies whether or not to render additional "cutout" border around the badge.
fill-modeBadgeFillDefines how theme colors are applied to a badge
iconStringDefines the name for an existing icon in a Kendo UI theme or SVG content. The icon is rendered inside the badge by a span.k-icon or span.k-svg-icon element.See web font icons help article for more details on Kendo UI icons.
maxDoubleIf text is a number, it will cap that number.
positionBadgePositionDefines the position of the badge
roundedRoundedDefines the shape of the badge
script-attributesIDictionary<String,Object>Sets the attributes that will be added to the script tag of the component's initialization script.
sizeBadgeSizeDefines the size of the badge
templateStringThe template which renders the content of the badge.
template-handlerStringThe template which renders the content of the badge. This option expects the name of a JavaScript function that will be called to return the template.
template-idStringThe template which renders the content of the badge. This option expects the ID of the script element that contains the template.
template-viewIHtmlContentThe template which renders the content of the badge. This option expects the instance containing the created HTML.
textStringThe text of the badge. Valid input includes string, number or object with toString method. Default is empty string.
theme-colorBadgeColorDefines the color of the badge
visibleBooleanIf set to false the badge will not be displayed.
In this article
ExampleAttributes
Not finding the help you need?
Contact Support