Changing Combobox's Popup position

answered 2012-01-13 09:36:32 +0800

yanushkevicheg
9

updated 2012-01-13 10:14:00 +0800

I mean actual combobox dropdown. The "pp" abbreviation in z-combobox zclass makes me call it popup all the time.

I found out that the dropdown's position is hardcoded in the web.js.zul.inp.ComboWidget.js file, in method open. Its value is "after_start", and I'd like it to be "overlap_end". Changing the line will work, but this isn't the best way.

At the moment I'm trying to create my one component the way it is described in ZK Component Development Essentials. I extended the org.zkoss.zul.Combobox class to use it as component-class and zul.inp.Combobox widget to use it as a widget class. After the implemention of the molds and the creation of configuration files I tested it and it worked the same way as the original combobox. Which was expected as no modifications were made.

Then I tried to override the open method of the widget class to change the dropdown's position. Here is what I've done:

ui.inp.NewCombobox = zk.$extends(zul.inp.Combobox, {

	open: function (opts) {
		this.$supers('open', arguments);
		this.changePosition();	
	},
	changePosition: function (){
		var pp = this.getPopupNode_(),
		inp = this.getInputNode();
		var $pp = zk(pp);
		$pp.position(inp, "overlap_end");	
	}
});

answered 2012-01-17 12:53:01 +0800

yanushkevicheg
9

Never mind, I made what I wanted by overriding slideDown_ method. As far as I get, the changes I tried to made were interrupting the animation process of the dropdown's appearing, caused by calling the original open method.