Skip to content

Instantly share code, notes, and snippets.

@ssajous
Last active June 13, 2016 21:37
Show Gist options
  • Save ssajous/5823594 to your computer and use it in GitHub Desktop.
Save ssajous/5823594 to your computer and use it in GitHub Desktop.
Knockout.js binding handler for the JQuery UI multiselect widget
<select multiple="multiple"
data-bind="multiselect : { config : multiSelectConfig,
options: options,
selectedOptions : selectedOptions }" />
ko.bindingHandlers.multiselect = {
init: function (element, valueAccessor, allBindingAccessors) {
"use strict";
var options = valueAccessor();
ko.bindingHandlers.options.update(
element,
function() { return options.options; },
allBindingAccessors
);
ko.bindingHandlers.selectedOptions.init(
element,
function() { return options.selectedOptions; },
allBindingAccessors
);
ko.bindingHandlers.selectedOptions.update(
element,
function() { return options.selectedOptions; },
allBindingAccessors
);
$(element).multiselect(options.config);
//make view model know about select/deselect changes
$(element).bind("multiselectcheckall", function () { $(element).trigger("change"); });
$(element).bind("multiselectuncheckall", function () { $(element).trigger("change"); });
},
update: function (element, valueAccessor, allBindingAccessors) {
"use strict";
var options = valueAccessor();
//update html if items set through code
ko.bindingHandlers.selectedOptions.update(
element,
function () { return options.selectedOptions; },
allBindingAccessors
);
$(element).multiselect("refresh");
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment