Menu & Select List

Menu and Select List components are controls for selecting one or more values from list of values. Menu is control for selecting one item from list using menu-like component having always one item selected. The Select List is control for selecting none, one or multiple values from simple list component.

As both components are very similar they have common super class Select. You can use it too but it makes sense only if you need to dynamically change between menu-like and list-like display.

When using any of these controls you usually set the dataProvider property to collection of the items it displays. To control what exactly is displayed set property labelField to item's property name that contains the item's label. On the other hand set property valueField to name of the item's property containing the item's value. Selected item's value is then accessible thru the value property of the control. The event change (px\controls\ControlEvent::CHANGE) is dispatched when the selection of the control changes.

syntax
elementnamespacename
Menuhttp://pexeso-php.sourceforge.net/1.0Menu
Select Listhttp://pexeso-php.sourceforge.net/1.0SelectList
Universal Selecthttp://pexeso-php.sourceforge.net/1.0Select

Component tester

Menu
component examplecomponent properties
disabled:true
labelField:label
gerLabel
value
value:0xf00
SelectList
component examplecomponent properties
disabled:true
allowMultipleSelection:true
labelField:label
gerLabel
value
values:
Select
component examplecomponent properties
disabled:true
allowMultipleSelection:true
rowCount:
values:red
component styles
width:
height:
fontSize:

Example

Selected value: 0xf00
Selected value(s): none

Example source code

Source code of the exmaple above.

<?xml version="1.0" encoding="UTF-8"?>
<px:Component xmlns:h="http://www.w3.org/1999/xhtml"
	xmlns:px="http://pexeso-php.sourceforge.net/1.0"
	xmlns:ex="examples">
	
	<px:Array name="colorComponents">
		<px:Object label="Red" value="0xf00" />
		<px:Object label="Green" value="0x0f0" />
		<px:Object label="Blue" value="0x00f" />
	</px:Array>
	
	<px:Form>
		<px:Menu name="menu"
			labelField="label" valueField="value"
			dataProvider="{^$self->colorComponents}"
			change="{$self}"/> Selected value:
		<h:samp color="{sprintf('#%03x', hexdec($self->menu->value))}"
			backgroundColor="#888">{$self->menu->value}</h:samp><h:br/>
		<px:SelectList name="selectList"
			labelField="label" valueField="value"
			dataProvider="{^$self->colorComponents}"
			change="{$self}"/> Selected value(s):
		<h:samp backgroundColor="#888"
color="{sprintf('#%03x', array_sum(array_map('hexdec', $self->selectList->values)))}"
>{$self->selectList->values?implode(", ",$self->selectList->values):'none'}</h:samp>
	</px:Form>
</px:Component>