Version: 2.0 |

RouteLink

in namespace DotVVM.Framework.Controls.Bootstrap4

Extends the builtin RouteLink control to allow applying Bootstrap CSS classes to the link.

Properties

Name Type Description Notes Default Value
Enabled Boolean
attribute
inner element
static value
bindable
default
True
IsBlockButton Boolean Gets or sets whether the button should be styled as a block element.
attribute
inner element
static value
bindable
default
False
RouteName String Gets or sets the name of the route in the route table.
attribute
inner element
static value
bindable
default
Size Size Gets or sets the size of the button.
attribute
inner element
static value
bindable
default
Default
Text String Gets or sets the text of the hyperlink.
attribute
inner element
static value
bindable
default
Type BootstrapButtonColor Gets or sets the color of the button.
attribute
inner element
static value
bindable
default
Primary
UrlSuffix String Gets or sets the suffix that will be appended to the generated URL (e.g. query string or URL fragment).
attribute
inner element
static value
bindable
default
VisualStyle ButtonVisualStyle Gets or sets whether the button has solid fill, or whether it is only an outline.
attribute
inner element
static value
bindable
default
SolidFill

Events

Name Type Description

Usage & Scenarios

Extends the builtin RouteLink control to allow using Bootstrap button CSS classes.

https://getbootstrap.com/docs/4.1/components/buttons/

HTML Rendered by the Control

Sample 1: RouteLink Sizing

Use the Size property to set the size of the link.

<bs:RouteLink RouteName="Route"
              Text="Button" />

<bs:RouteLink RouteName="Route" 
              Text="Button" 
              Size="Large" />

<bs:RouteLink RouteName="Route"
              Text="Button" 
              Size="Small" />

<bs:RouteLink RouteName="Route"
              Text="Button" 
              Size="ExtraSmall" />

Sample 2: RouteLink Types

The Type property specifies the color of the link (using standard Bootstrap classes).

<bs:RouteLink RouteName="Route"
              Text="Primary"
              Type="Primary" />

<bs:RouteLink RouteName="Route"
              Text="Secondary"
              Type="Secondary" />

<bs:RouteLink RouteName="Route"
              Text="Success"
              Type="Success" />

<bs:RouteLink RouteName="Route"
              Text="Danger"
              Type="Danger" />

<bs:RouteLink RouteName="Route"
              Text="Warning"
              Type="Warning" />

<bs:RouteLink RouteName="Route"
              Text="Info"
              Type="Info" />

<bs:RouteLink RouteName="Route"
              Text="Light"
              Type="Light" />

<bs:RouteLink RouteName="Route"
              Text="Dark"
              Type="Dark" />

<bs:RouteLink RouteName="Route"
              Text="Link"
              Type="Link" />

Sample 3: RouteLink Shapes

The Shape property allows to switch between button with solid fill and outline buttons.

<bs:RouteLink RouteName="Route"
              Text="Solid Fill"
              Type="Primary"
              Shape="SolidFill" />

<bs:RouteLink RouteName="Route"
              Text="Outline"
              Type="Primary"
              Shape="Outline" />

Sample 4: Block RouteLink

To make the link behave like a block element, use the IsBlockButton property.

<bs:RouteLink RouteName="Route"
              Text="Solid Fill"
              Type="Primary"
              IsBlockButton="true" />

Suggestions


Help & Contribute

The documentation is maintained on GitHub.
We'll be happy if you edit the page and create a pull request.

Send message