Label
By default, the Rating displays a label that shows the current value out of the max value in the format 3 / 5.
If the Rating does not have a selected value, the label will not be displayed initially and will be toggled after an item is selected.
Getting Started
The following example demonstrates how to use the default label.
@(Html.Kendo().Rating()
.Name("rating")
.Min(1)
.Max(6)
.Value(3)
)
<kendo-rating name="rating" min="1" max="6" value="3"></kendo-rating>
Customizing the Label
To customize the text of the label, use the Label.TemplateId property. by default, the template automatically receives the value and maxValue in the data object which allows you to use those properties inside the template through the Kendo UI Templates syntax.
@(Html.Kendo().Rating()
.Name("rating")
.Min(1)
.Max(6)
.Value(3)
.Label(l => l.TemplateId("rating-label-template"))
)
<script id="rating-label-template" type="text/x-kendo-template">
<span>
#: value # out of #: maxValue #
</span>
</script>
<kendo-rating name="rating" min="1" max="6" value="3">
<label template-id="rating-label-template" />
</kendo-rating>
<script id="rating-label-template" type="text/x-kendo-template">
<span>
#: value # out of #: maxValue #
</span>
</script>
Disabling the Label
Setting the Label property to false prevents the label from being displayed.
@(Html.Kendo().Rating()
.Name("rating")
.Min(1)
.Max(6)
.Value(3)
.Label(false)
)
<kendo-rating name="rating" min="1" max="6" value="3">
<label enabled="false" />
</kendo-rating>