gvas / knockout-jqueryui

Knockout bindings for the jQuery UI widgets.
http://gvas.github.com/knockout-jqueryui/
MIT License
103 stars 38 forks source link

selectmenu not working when on a dialog #58

Open wluke opened 7 years ago

wluke commented 7 years ago

Hi!

I've noticed that selectmenu doesn't work correctly when it's included on a dialog. It seems that selectmenu needs special treatment. A simple "refresh" won't work, apparently it needs destroyed and re-created when the dialog is shown, or else either it shows the dropdown behind the dialog, or it throws an error. So, I've added an additional parameter to the selectmenu, called "recreateOn". This can be set to a ko observable, which when changed will cause the selectmenu to be destroyed and recreated. In my setup I update this observable when the dialog is opened.

eg:

selectmenu: { width: 200, refreshOn: $data.CMIHeaderFormID.options, recreateOn: $data.dialogFullyOpen }

This is then added to the Selectmenu.prototype.update function as such:

if (allBindingsAccessor().selectmenu.hasOwnProperty('recreateOn')) {
                var hook = ko.utils.unwrapObservable(allBindingsAccessor().selectmenu.recreateOn);
                $(element).selectmenu('destroy');
                BindingHandler.prototype.init.apply(this, arguments);
            }

Might be a bit hacky, but seems to work!