Cannot Reference Kendo Switch

[Mark]

I have a two Switch widgets on my page and have a change event setup for one of them. In the change function i'm trying to get a reference to the other switch on the page to see if it is checked. All I get is 'Undefined'.

<div class="col-md-6">
        <div class="form-group pt-2">
            @(Html.Kendo().Switch()
                  .Name("Immediate")
                  .Messages(c => c.Checked("YES").Unchecked("NO"))
                  )
            <label for="reportable">Save changes immediately</label>
        </div>
        <div class="form-group">
            @(Html.Kendo().Switch()
                  .Name("Scheduled")
                  .Messages(c => c.Checked("YES").Unchecked("NO"))
                  .Events(e => e.Change("onScheduledChange"))
                  )
            <label for="history">Schedule/Back-Date Changes</label>
        </div>
    </div>

and here's my JS:

<script>
    function onScheduledChange(e) {
        var immediateSwitch = $("#Immediate").checked;
        if (e.checked) {
            //alert("scheduled is checked");
            alert(immediateSwitch);
        }
    }
</script>

immediateSwitch returns undefined.

I've also tried this:

<script>
    function onScheduledChange(e) {
        var immediateSwitch = $("#Immediate").data("kendoSwitch");
        if (e.checked) {
            //alert("scheduled is checked");
            alert(immediateSwitch.checked);
        }
    }
</script>

 

and got the same results. How do you get a reference to another Switch on the page??????

 

 

 

[Preslav]

Hello Mark,

The correct code of getting the Switch reference is the second one:

var immediateSwitch = $("#Immediate").data("kendoSwitch");

However, to get its value, use the value method:

immediateSwitch.value()

Please, give this a try, and let me know if it works for you.


Regards,
Preslav
Progress Telerik

[Anoop]

What change should I make to get the below error?

My kendo switch has Deferred loading.

immediateSwitch.value() is not defined

[Ivan Danchev]

Hello Anoop,

Add your script that gets a reference to the Switch after the DeferredScripts method call. You can also call the logic in a document.ready handler, e.g.,

 @Html.Kendo().DeferredScripts()

<script>
    $(document).ready(function() {
         var immediateSwitch = $("#Immediate").data("kendoSwitch");
         var value = immediateSwitch.value();
         console.log(value);
    })
</script>

Additionally, make sure you are using the actual Name of your Switch at the place highlighted above.