Patch for ui.core.js - handling option changes
I'd like to suggest a patch to make it easier to implement handling of
options and reaction to option changes.
This allows widget implementers to just add a function to validate
individual options instead of having to proxy _setData, pseudo-code
example:
$.widget('ui.something', {
_set: {
somevalue: function( newValue, oldValue ) {
if (newValue is invalid) {
return oldValue;
} else {
return newValue;
}
}
}
});
This function gets the widget as 'this' and the new and old values as
args, and returns whatever should be store in this.options[key].
It also does the same for _getData.
I've also added a patch to the 'option' method, which triggers an
internal '_updated' method.
The idea is that _updated will cause the display to be updated.
So that _setData and _set methods don't need to worry about refreshing
the display.
Internally the widget can set as many options as necessary through
_setData and then perform
it's own refresh, maybe through _updated.
Widget users can also set many options via
something.mywidget('option', {optionA: ..., optionB: ... }),
and the display will be updated once by _updated after all options
have been set internal through _setData calls.
I hope this make sense :)
Index: ui/ui.core.js
===================================================================
--- ui/ui.core.js (revision 2387)
+++ ui/ui.core.js (working copy)
@@ -314,21 +314,27 @@
$.each(options, function(key, value) {
self._setData(key, value);
});
+
+ this._updated(options);
},
_getData: function(key) {
- return this.options[key];
+ return this._get && this._get[key] ? this._get[key].call(this,
this.options[key]) : this.options[key];
},
_setData: function(key, value) {
- this.options[key] = value;
+ if (this._set && this._set[key]) {
+ this.options[key] = this._set[key].call(this, value, this.options[key]);
+ } else {
+ this.options[key] = value;
- if (key == 'disabled') {
- this.element
- [value ? 'addClass' : 'removeClass'](
- this.widgetBaseClass + '-disabled' + ' ' +
- this.namespace + '-state-disabled')
- .attr("aria-disabled", value);
+ if (key == 'disabled') {
+ this.element.toggleClass(
+ this.widgetBaseClass + '-disabled' + ' ' +
+ this.namespace + '-state-disabled', value)
+ .attr("aria-disabled", value);
+ }
}
},
+ _updated: function() {},
enable: function() {
this._setData('disabled', false);