Skip to content

Instantly share code, notes, and snippets.

@ivanovvitaly
Created July 8, 2015 11:17
Show Gist options
  • Save ivanovvitaly/9a7fc8f5abe7366d8b53 to your computer and use it in GitHub Desktop.
Save ivanovvitaly/9a7fc8f5abe7366d8b53 to your computer and use it in GitHub Desktop.
Knockout binding handler for Bootstrap Slider
/*
How to use:
<input type="text" data-bind="bsSlider: { value: distance, min: 1, max: 100, step: 5 }"/>
Options can be removed or overriden.
*/
ko.bindingHandlers.bsSlider = {
init: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
var options = ko.unwrap(valueAccessor());
options = $.extend(ko.bindingHandlers.bsSlider.options, options);
var valueObservable = options.value;
options.value = valueObservable();
$(element).slider(options).on('slide', function (e) {
valueObservable(e.value);
});
ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
$(element).slider("destroy");
});
},
update: function (element, valueAccessor, allBindings, data, context) {
var options = ko.unwrap(valueAccessor());
var value = options.value();
$(element).slider('setValue', value);
},
options: {
tooltip: 'always'
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment