cloning a control to a new control.

[devnull]

Code:

$.fn.multibox = $.fn.combo;

I want to create a new object that inherits all of the properties, methods etc of the combo, and then modify it adding new methods etc.

I do not want these changes to be reflected in the original combo object.

I believe that the above will create an alias to combo, and any changes to multibox will also appy to combo ??

[devnull]

Bump...

[jarry]

This is the skeleton to create a new multibox component based on combo.

Code:

(function($){
	function create(target){
		var state = $.data(target, 'multibox');
		var opts = state.options;
		
		$(target).addClass('multibox-f');
		$(target).combo($.extend({}, opts, {
			
		}));

	}
	$.fn.multibox = function(options,param){
		if (typeof options == 'string'){
			var method = $.fn.multibox.methods[options];
			if (method){
				return method(this, param);
			} else {
				return this.combo(options, param);
			}
		}
		options = options || {};
		return this.each(function(){
			var state = $.data(this, 'multibox');
			if (state){
				$.extend(state.options, options);
			} else {
				state = $.data(this, 'multibox', {
					options: $.extend({}, $.fn.multibox.defaults, $.fn.combo.parseOptions(this), options)
				});
			}
			create(this);
		});
	};
	$.fn.multibox.defaults = $.extend({}, $.fn.combo.defaults, {
	});
	$.fn.multibox.methods = {
		options: function(jq){
			var copts = jq.combo('options');
			return $.extend($.data(jq[0], 'multibox').options, {
				width: copts.width,
				height: copts.height,
				originalValue: copts.originalValue,
				disabled: copts.disabled,
				readonly: copts.readonly
			});
		}
	}
})(jQuery);

[devnull]

Thanks so much :-)

[devnull]

Hi Jarry is it not possible to just do:

Code:

$.fn.multibox = Object.assign($.fn.combo);

[jarry]

Hi Jarry is it not possible to just do:

Code:

$.fn.multibox = Object.assign($.fn.combo);

The two plugins 'multibox' and 'combo' will share the same definitions. The new methods added to the multibox will be added to combo too.

[devnull]

OK, then is it then possible to create a clone() function that will allow me to generically clone any control to a new control ?

This would be very useful :-)

[Tomas]

How would you call the new control from markup?

Thanks,
Tomas

[devnull]

You would call it just like you call any other standard control, only using the new control name.

[devnull]

@jarry - this multibox control seems to work except for when using form.load() function.

I have created a setValue() function for this control, and for debugging purposes, I logged some text to the console when the setValue() function is called.

If I call this from the chrome javascript console, then the value is updated correctly and I see the text logged to the console, however when I use form.load() the text is not logged to the console and it looks like form.load() does not call setValue() on the control.

Any suggestions on what the cause / fix may be ?

[jarry]

Please run the code below to add the 'multibox' component to the form field set.

Code:

<script>
$.parser.plugins.push('multibox');
$.fn.form.defaults.fieldTypes.unshift('multibox');
</script>