Rating
in namespace DotVVM.BusinessPack.Controls
Renders a set of points allowing users to edit rating.
Usage & Scenarios
Displays several stars (or any other symbols) and lets the user any number of them.
Sample 1: Basic Usage
The Value property represents a number of stars selected by the user.
The MaxValue specifies the number of stars to be displayed.
<bp:Rating Value="{value: Rating}"
MaxValue="5" />using DotVVM.Framework.ViewModel;
namespace DotvvmWeb.Views.Docs.Controls.businesspack.Rating.sample1
{
public class ViewModel : DotvvmViewModelBase
{
public double Rating { get; set; } = 4.5;
}
}Sample 2: Configuration
The AllowHalfPoints allows to select half of a star to be able to get more precise rating. By default, the user can select only the entire star.
The AllowPreviewOnHover property can be used to disable the hover effect that indicates which stars will be selected on click.
<bp:Rating Value="{value: Rating}"
MaxValue="5"
AllowHalfPoints="false"
AllowPreviewOnHover="false" />using DotVVM.Framework.ViewModel;
namespace DotvvmWeb.Views.Docs.Controls.businesspack.Rating.sample2
{
public class ViewModel : DotvvmViewModelBase
{
public double Rating { get; set; } = 4;
}
}Sample 3: Changed Event
The Changed property specifies a command in the viewmodel that is triggered whenever the user changes the rating.
<bp:Rating Value="{value: Rating}"
MaxValue="5"
Changed="{command: RatingChanged()}" />
<p>Rating has changed {{value: ChangeCount}} times.</p>using DotVVM.Framework.ViewModel;
namespace DotvvmWeb.Views.Docs.Controls.businesspack.Rating.sample3
{
public class ViewModel : DotvvmViewModelBase
{
public double Rating { get; set; } = 4.5;
public int ChangeCount { get; set; }
public void RatingChanged()
{
ChangeCount++;
}
}
}Sample 4: Custom Icons
The icon used by the control can be customized using the following inner elements:
PointIconrepresents an icon that user can select. The default isStaricon.
See the Icon documentation to find about using other icon packs.
<bp:Rating Value="{value: Rating}"
MaxValue="5">
<PointIcon>
<bp:Icon Icon="Plus"></bp:Icon>
</PointIcon>
</bp:Rating>using DotVVM.Framework.ViewModel;
namespace DotvvmWeb.Views.Docs.Controls.businesspack.Rating.sample4
{
public class ViewModel : DotvvmViewModelBase
{
public double Rating { get; set; } = 3.5;
}
}Properties
| Name | Type | Description | Notes | Default Value | |
|---|---|---|---|---|---|
 |
AllowHalfPoints | Boolean | Gets or sets whether users can select half point values (eg. 4.5). It's enabled by default. |
attribute
static value
bindable
|
True |
|
AllowPreviewOnHover | Boolean | Gets or sets whether to preview a value when mouse is over a rating point. It's enabled by default. |
attribute
static value
bindable
|
True |
|
AutoFocus | Boolean | Gets or sets whether the control should have focus when page loads or when a dialog is opened. The default value is false. |
attribute
static value
|
False |
|
ClientIDMode | ClientIDMode | Gets or sets the client ID generation algorithm. |
attribute
static value
|
Static |
|
DataContext | Object | Gets or sets a data context for the control and its children. All value and command bindings are evaluated in context of this value. The DataContext is null in client-side templates. |
attribute
bindable
|
null |
|
Enabled | Boolean | Gets or sets whether the control is enabled and can be modified. |
attribute
static value
bindable
|
True |
|
ID | String | Gets or sets the control client ID within its naming container. |
attribute
static value
bindable
|
null |
|
IncludeInPage | Boolean | Gets or sets whether the control is included in the DOM of the page. |
attribute
bindable
|
True |
|
MaxValue | Int32 | Gets or sets the maximum the Value can reach. The default maximum is 5. |
attribute
static value
bindable
|
5 |
|
PointIcon | SvgIconBase | Gets or sets the icon displayed on each rating point. |
inner element
static value
bindable
|
null |
|
TabIndex | Int32 | Gets or sets the order in which the control is reachable in sequential keyboard navigation. The default value is 0 which means the document order. |
attribute
static value
bindable
|
0 |
|
Value | Double? | Gets or sets the rating selected by user. |
attribute
bindable
|
null |
|
Visible | Boolean |
attribute
bindable
|
True |
Events
| Name | Type | Description | |
|---|---|---|---|
 |
Changed | Command | Gets or sets the command triggered when the Value is changed. |