UI Widgets Switch

A switch widget.

Type: Object

The dxSwitch widget is a switch that can have an on or off state. The current widget state is specified by the value configuration option. Declare an observable variable and pass it to the value option to update the variable value each time a switch state changes.

var switchState = ko.observable(false);

To create a dxSwitch widget, add a div element with dxSwitch Knockout binding within the body of the required view.

<div data-bind="dxSwitch:{value:switchState}"></div>

Refer to the Add a widget documentation section to learn how to create widgets in detail.

Show Example:
<div class="dx-fieldset">
  <div class="dx-field">
    <div class="dx-field-label">Switch</div>
    <div class="dx-field-value" data-bind="dxSwitch: { value: switchState }"></div>
  <div class="dx-field">
    <div class="dx-field-label">Value</div>
    <div class="dx-field-value" data-bind="text: switchState"></div>
switchState = ko.observable(false);


An object defining configuration options for the dxSwitch widget.


This section describes members used to manipulate the object.