Disabling kendo datepicker when clicked on checkbox

问题

I have two kendo date picker in input boxes and one checkbox I want to show the kendo datepickers all the time with current date . but they become enable /selectable /editable ONLY when user has checked the checkbox.

Checkbox

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

2 kendo Datepickers.

<input type="text" id="DateFrom" />
<input type="text" id="DateTo" />

I have tried various things like disabling text-boxes etc but datepickers just keep working/showing..

回答1:

There is special method for enabling/disabling the DatePicker called enable - check this demo.

$('#RequredFilter').click(function(e){
    if($(this).is(':checked')){
        $('#DateFrom').data('kendoDatePicker').enable(true);
        $('#DateTo').data('kendoDatePicker').enable(true);
    }
    else{
        $('#DateFrom').data('kendoDatePicker').enable(false);
        $('#DateTo').data('kendoDatePicker').enable(false);
    }
})

回答2:

Here's a slightly different approach:

$(document).ready(function() {
    $("#RequredFilter").change(function() {
        $('#DateFrom').data('kendoDatePicker').enable(this.checked);
        $('#DateTo').data('kendoDatePicker').enable(this.checked);
    });
});

来源：https://stackoverflow.com/questions/14338132/disabling-kendo-datepicker-when-clicked-on-checkbox