Data-binding options:
Example:
In this example, the ViewModel is defined specifically for use with the calendar. It has disabled, allowPreview and showWeekNumbers properties that are bound in the View. If any of these values change, then the widgets will automatically respond to them. The widgets also update the ViewModel values as they modify them. The week numbers are visible, and if you mouse over the the previousPreview or nextPreview button, you can preview the previous or next months.
Create a ViewModel:
ViewModel Script |
Copy Code |
---|---|
var viewModel = function () { var self = this; self.disabled = ko.observable(false); self.showTitle = ko.observable(true); self.showWeekDays = ko.observable(true); self.showWeekNumbers = ko.observable(false); self.showOtherMonthDays = ko.observable(true); self.showDayPadding = ko.observable(false); self.allowPreview = ko.observable(false); self.allowQuciPick = ko.observable(true); self.popupMode = ko.observable(false); self.selectedDates = ko.observableArray(); } |
Create View with Bound Controls:
View Markup |
Copy Code |
---|---|
<div data-bind="wijcalendar: { disabled: disabled, allowPreview: allowPreview, showWeekNumbers: showWeekNumbers}"> |