ZK Component Reference/Input/Bandbox

Bandbox

• Demonstration: Bandbox
• Java API: Bandbox
• JavaScript API: Bandbox
• Style Guide: Bandbox

Employment/Purpose

A bandbox is a special text box that embeds a customizable popup window (aka., a dropdown window). Like comboboxes, a bandbox consists of an input box and a popup window. The popup window is opened automatically, when users presses Alt+DOWN or clicks the magnifier button.

Unlike comboboxes, the popup window of a bandbox could be anything. It is designed to give developers the maximal flexibility. A typical use is to represent the popup window as a search dialog.

Example

<bandbox id="bd">
	<bandpopup>
		<vbox>
			<hbox>
				Search
				<textbox />
			</hbox>
			<listbox width="200px"
				onSelect="bd.value=self.selectedItem.label;    bd.closeDropdown();">
				<listhead>
					<listheader label="Name" />
					<listheader label="Description" />
				</listhead>
				<listitem>
					<listcell label="John" />
					<listcell label="CEO" />
				</listitem>
				<listitem>
					<listcell label="Joe" />
					<listcell label="Engineer" />
				</listitem>
				<listitem>
					<listcell label="Mary" />
					<listcell label="Supervisor" />
				</listitem>
			</listbox>
		</vbox>
	</bandpopup>
</bandbox>

Inherited Functions

Please refer to Textbox for inherited functions.

Mouseless Entry bandbox

• Alt+DOWN to pop up the list.
• Alt+UP or ESC to close the list.
• UP and DOWN to change the selection of the items from the list.

Supported Events

Name	Event Type
onOpen	Event: OpenEvent Denotes user has opened or closed a component. Note: unlike onClose, this event is only a notification. The client sends this event after opening or closing the component.

• Inherited Supported Events: Textbox

Supported Molds

Available molds of a component are defined in lang.xml embedded in zul.jar.

Name	Snapshot
default
rounded	[Since 5.0.0]

Supported Children

* Bandpopup 

Use Cases

Version	Description	Example Location

Version History

Version	Date	Content