ToggleButton

in namespace DotVVM.BusinessPack.Controls

Renders the HTML button that can switch states (like CheckBox control).

Usage & Scenarios

Renders the HTML button that can switch states like the CheckBox

Sample 1: Basic Usage

The ToggleButton control has the Checked property of boolean which indicates whether the control is checked or not.

You can use the Text property to specify the button text. Or you can put contents inside the bp:ToggleButton element.

<bp:ToggleButton Text="Toggle button" Checked="{value: Checked}"/>
using System;
using DotVVM.Framework.ViewModel;

namespace DotvvmWeb.Views.Docs.Controls.businesspack.ToggleButton.sample1
{
    public class ViewModel : DotvvmViewModelBase
    {
        public bool Checked { get; set; }
    }
}

Sample 1: Basic Usage

You can set which command will be triggered when the button is clicked with click property.

<bp:ToggleButton Checked="{value: Checked}"
                 Click="{command: ClickCount = ClickCount + 1}">
    <span>Toggle button</span>
</bp:ToggleButton>

<p>Click counter: {{value: ClickCount}}</p>
using System;
using DotVVM.Framework.ViewModel;

namespace DotvvmWeb.Views.Docs.Controls.businesspack.ToggleButton.sample2
{
    public class ViewModel : DotvvmViewModelBase
    {
        public bool Checked { get; set; }
        public int ClickCount { get; set; }
    }
}

Properties

Name Type Description Notes Default Value
property icon Checked Boolean Gets or sets whether the button is checked. The value is changed when the button is clicked, right before the Click command is triggered. The default value is false.
attribute
inner element
static value
bindable
default
False
property icon DisableContentStyle Boolean
attribute
inner element
static value
bindable
default
False
property icon Enabled Boolean Gets or sets a value indicating whether the button is enabled and can be clicked on.
attribute
inner element
static value
bindable
default
True
property icon Text String Gets or sets the text displayed on the button.
attribute
inner element
static value
bindable
default

Events

Name Type Description
event icon Click Command Gets or sets the command triggered when the button is clicked.

HTML produced by the control