knockout-jqueryui
knockout-jqueryui copied to clipboard
dialog properties don't seem to be getting updated
I've got a div with the following data-bind set up (outer tag redacted because I couldn't get it to show with markdown without a fight):
''' data-bind="dialog: {resizable: true, title: windowTitle, width: width, height: height, position: position }" '''
I have a number of the following javascript objects bound to the documentWindow class div shown above:
''' var windowManager = function (options) { var self = this;
var data = $.extend({
width: 250,
height: 250,
documentName: '',
documentType: '',
position: {
my: 'left top',
at: 'left-top',
of: '#dashboard'
}
}, options);
self.width = ko.observable(data.width);
self.height = ko.observable(data.height);
self.documentName = ko.observable(data.documentName);
self.documentType = ko.observable(data.documentType);
self.isOpen = ko.observable(data.isOpen);
self.windowTitle = ko.computed(function() {
return self.documentName() + ' - ' + self.documentType();
});
'''
Now, I can verify that these properties are being bound. I can see the window title, for instance, and the width and height is set appropriately when binding first occurs. After that, moving the dialogs and/or resizing them is not reflected in the bound objects. Any suggestions?
These options are bound one-way (viewmodel -> dialog widget). If the viewmodel's property changes then the dialog's option will be also updated, but not the other way around. The dialog binding's only option which is bound 2-way is the isOpen option.
Making the width and height two-way is simple. The binding could handle the widget's resizeStop event and update the viewmodel when the size changes. Making the position option two-way is harder. The widget raises the dragStop event when the dialog's position changes, but the position object's complexity make it hard to update.
Anyway, thanks for this bug report/feature request! I will definitely implement these.
As of v2.0.1 the width and height options support two-way data binding.