Indeterminate state

The following example demonstrates how to set an indeterminate state of the Kendo UI Switch. The switch component behaves as a checkbox element. The indeterminate state is used only for visual representation, and thus the component will remain either checked, or unchecked.

      .k-indeterminate .k-switch-container {
          background-color: #dfdfdf !important;

  <input type="checkbox" id="switch" />

    var switchButton = $("#switch").kendoSwitch({
        checked: true,
        messages: {
            checked: "Yes",
            unchecked: "No",
        change: function (e) {
            if (!e.checked) {
                if (!e.sender.element.prop("indeterminate")) {
                    e.sender.element.prop("indeterminate", true);

                    e.sender.setOptions({messages: {checked: "N/A"}});
                } else {
                    e.sender.element.prop("indeterminate", false);

                    e.sender.setOptions({messages: {checked: "Yes"}});


See Also

In this article
Not finding the help you need? Improve this article