Untitled diff
7 removals
50 lines
9 additions
52 lines
(function($, undefined) {
(function($, undefined) {
ko.bindingHandlers.timepicker = {
ko.bindingHandlers.timepicker = {
init: function (element, valueAccessor, allBindingsAccessor) {
init: function (element, valueAccessor, allBindingsAccessor) {
//initialize timepicker with some optional options
//initialize timepicker with some optional options
var options = allBindingsAccessor().timepickerOptions || {},
var options = allBindingsAccessor().timepickerOptions || {},
input = $(element).timepicker(options);
input = $(element).timepicker(options);
//handle the field changing
//handle the field changing
ko.utils.registerEventHandler(element, "time-change", function (event, time) {
ko.utils.registerEventHandler(element, "time-change", function (event, time) {
var observable = valueAccessor(),
var observable = valueAccessor(),
current = ko.utils.unwrapObservable(observable);
current = ko.utils.unwrapObservable(observable),
instance = $(element).timepicker();
if ( time === false ) {
if ( time === false ) {
observable( 'enter the value when input is empty here!' );
observable( '' );
} else if (current - time !== 0) {
} else if (current - time !== 0) {
observable(time);
observable( instance.format( time ) );
}
}
});
});
//handle disposal (if KO removes by the template binding)
//handle disposal (if KO removes by the template binding)
ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
$(element).timepicker("destroy");
$(element).timepicker("destroy");
});
});
},
},
update: function (element, valueAccessor) {
update: function (element, valueAccessor) {
var value = ko.utils.unwrapObservable(valueAccessor()),
var value = ko.utils.unwrapObservable(valueAccessor()),
// calling timepicker() on an element already initialized will
// calling timepicker() on an element already initialized will
// return a TimePicker object
// return a TimePicker object
instance = $(element).timepicker();
instance = $(element).timepicker(),
time = $.fn.timepicker.parseTime( value );
if (value - instance.getTime() !== 0) {
if (time - instance.getTime() !== 0) {
instance.setTime(value);
instance.setTime( time );
}
}
}
}
};
};
var model = {
var model = {
// all Date objects returned by the timepicker have the date
// all Date objects returned by the timepicker have the date
// part set to Dec 31 1899. That date is not important, but
// part set to Dec 31 1899. That date is not important, but
// using the same value every time makes internal calculations
// using the same value every time makes internal calculations
// easier.
// easier.
time: ko.observable($.fn.timepicker.parseTime('2:20:35 pm'))
time: ko.observable( '2:20:35 pm' )
}
}
$(function() {
$(function() {
ko.applyBindings(model);
ko.applyBindings(model);
});
});
})(jQuery);
})(jQuery);