Displays a control consisting of a TextInput and Button that allows an item from a collection to be selected. When the button is triggered, a list box of items is displayed as a pop-up. The text input allows filtering, or (optionally) choosing custom items.

The following example creates a GridComboBox, gives it a data provider, tells the cell renderer how to interpret the data, and listens for when the selection changes:

var gridComboBox = new GridComboBox();

gridComboBox.dataProvider = new ArrayCollection([
	{ item: "Chicken breast", dept: "Meat", price: "5.90" },
	{ item: "Butter", dept: "Dairy", price: "4.69" },
	{ item: "Broccoli", dept: "Produce", price: "2.99" },
	{ item: "Whole Wheat Bread", dept: "Bakery", price: "2.49" }
]);
gridComboBox.columns = new ArrayCollection([
	new GridViewColumn("Item", (data) -> data.item),
	new GridViewColumn("Department", (data) -> data.dept),
	new GridViewColumn("Price", (data) -> data.price)
]);

// to display in the button
gridComboBox.itemToText = (data:Dynamic) -> {
	return data.item;
};

gridComboBox.addEventListener(Event.CHANGE, (event:Event) -> {
	var gridComboBox = cast(event.currentTarget, GridComboBox);
	trace("GridComboBox changed: " + gridComboBox.selectedIndex + " " + gridComboBox.selectedItem.text);
});

this.addChild(gridComboBox);

Events:

openfl.events.Event.CHANGE

Dispatched when either GridComboBox.selectedItem or GridComboBox.selectedIndex changes.

openfl.events.Event.OPEN

Dispatched when the pop-up grid view is opened.

openfl.events.Event.CLOSE

Dispatched when the pop-up grid view is closed.

feathers.events.GridViewEvent.ITEM_TRIGGER

Dispatched when the user taps or clicks a cell renderer in the pop-up grid view. The pointer must remain within the bounds of the cell renderer on release, and the list view cannot scroll before release, or the gesture will be ignored.

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

Static variables

@:value("gridComboBox_button")staticfinalread onlyCHILD_VARIANT_BUTTON:String = "gridComboBox_button"

The variant used to style the Button child component in a theme.

To override this default variant, set the GridComboBox.customButtonVariant property.

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

@:value("gridComboBox_gridView")staticfinalread onlyCHILD_VARIANT_GRID_VIEW:String = "gridComboBox_gridView"

The variant used to style the GridView child component in a theme.

To override this default variant, set the GridComboBox.customGridViewVariant property.

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

@:value("gridComboBox_textInput")staticfinalread onlyCHILD_VARIANT_TEXT_INPUT:String = "gridComboBox_textInput"

The variant used to style the TextInput child component in a theme.

To override this default variant, set the GridComboBox.customTextInputVariant property.

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

Constructor

new(?dataProvider:IFlatCollection<Dynamic>, ?changeListener:Event ‑> Void)

Creates a new GridComboBox object.

Available since

feathersui-data-containers-pack 1.0.0

.

Variables

allowCustomUserValue:Bool

Allows the user to type a custom value into the text input. If a custom value is selected, the selectedIndex property will be -1, but the selectedItem property will contain the custom value.

Available since

feathersui-data-containers-pack 1.0.0

.

buttonFactory:AbstractDisplayObjectFactory<Dynamic, Button>

Creates the button, which must be of type feathers.controls.Button.

In the following example, a custom button factory is provided:

gridComboBox.buttonFactory = () ->
{
	return new Button();
};
Available since

feathersui-data-containers-pack 1.0.0

.

See also:

  • feathers.controls.Button

cellRendererRecycler:AbstractDisplayObjectRecycler<Dynamic, GridViewCellState, DisplayObject>

Manages cell renderers used by the grid view.

In the following example, the pop-up grid view uses a custom cell renderer class:

gridComboBox.cellRendererRecycler = DisplayObjectRecycler.withClass(CustomItemRenderer);
Available since

feathersui-data-containers-pack 1.0.0

.

See also:

  • feathers.controls.dataRenderers.ItemRenderer

  • feathers.controls.dataRenderers.LayoutGroupItemRenderer

columns:IFlatCollection<GridViewColumn>

Defines the set of columns to display for each item in the grid view's data provider. If null, the grid view will attempt to populate the columns automatically using reflection.

The following example passes in a data provider and tells the columns how to interpret the data:

gridComboBox.dataProvider = new ArrayCollection([
	{ item: "Chicken breast", dept: "Meat", price: "5.90" },
	{ item: "Butter", dept: "Dairy", price: "4.69" },
	{ item: "Broccoli", dept: "Produce", price: "2.99" },
	{ item: "Whole Wheat Bread", dept: "Bakery", price: "2.49" }
]);
gridComboBox.columns = new ArrayCollection([
	new GridViewColumn("Item", (data) -> data.item),
	new GridViewColumn("Department", (data) -> data.dept),
	new GridViewColumn("Price", (data) -> data.price)
]);

// to display in the button
gridComboBox.itemToText = (data:Dynamic) -> {
	return data.item;
};
Available since

feathersui-data-containers-pack 1.0.0

.

See also:

@:style@:flash.propertycustomButtonVariant:String

A custom variant to set on the button, instead of GridComboBox.CHILD_VARIANT_BUTTON.

The customButtonVariant will be not be used if the result of buttonFactory already has a variant set.

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

@:style@:flash.propertycustomGridViewVariant:String

A custom variant to set on the pop-up grid view, instead of GridComboBox.CHILD_VARIANT_GRID_VIEW.

The customGridViewVariant will be not be used if the result of gridViewFactory already has a variant set.

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

@:style@:flash.propertycustomTextInputVariant:String

A custom variant to set on the text input, instead of GridComboBox.CHILD_VARIANT_TEXT_INPUT.

The customTextInputVariant will be not be used if the result of textInputFactory already has a variant set.

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

@:bindable("dataChange")dataProvider:IFlatCollection<Dynamic>

The collection of data displayed by the list.

Items in the collection must be class instances or anonymous structures. Do not add primitive values (such as strings, booleans, or numeric values) directly to the collection.

Additionally, all items in the collection must be unique object instances. Do not add the same instance to the collection more than once because a runtime exception will be thrown.

The following example passes in a data provider and tells the item renderer how to interpret the data:

gridComboBox.dataProvider = new ArrayCollection([
	{ item: "Chicken breast", dept: "Meat", price: "5.90" },
	{ item: "Butter", dept: "Dairy", price: "4.69" },
	{ item: "Broccoli", dept: "Produce", price: "2.99" },
	{ item: "Whole Wheat Bread", dept: "Bakery", price: "2.49" }
]);
gridComboBox.columns = new ArrayCollection([
	new GridViewColumn("Item", (data) -> data.item),
	new GridViewColumn("Department", (data) -> data.dept),
	new GridViewColumn("Price", (data) -> data.price)
]);

// to display in the button
gridComboBox.itemToText = (data:Dynamic) -> {
	return data.item;
};
Available since

feathersui-data-containers-pack 1.0.0

.

See also:

  • feathers.data.ArrayCollection

gridViewFactory:AbstractDisplayObjectFactory<Dynamic, GridView>

Creates the grid view that is displayed as a pop-up. The grid view must be of type feathers.controls.GridView.

In the following example, a custom grid view factory is provided:

gridComboBox.gridViewFactory = () ->
{
	return new GridView();
};
Available since

feathersui-data-containers-pack 1.0.0

.

See also:

  • feathers.controls.GridView

read onlymaxSelectedIndex:Int

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

  • feathers.core.IndexSelector.maxSelectedIndex

read onlyopen:Bool

Indicates if the pop-up list is open or closed.

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

@:value(false)openGridViewOnFocus:Bool = false

Determines if the pop-up list should automatically open when the combo box receives focus, or if the user is required to click the open button.

Available since

feathersui-data-containers-pack 1.0.0

.

@:style@:flash.propertypopUpAdapter:IPopUpAdapter

Manages how the pop-up list is displayed when it is opened and closed.

In the following example, a custom pop-up adapter is provided:

gridComboBox.popUpAdapter = new DropDownPopUpAdapter();
Available since

feathersui-data-containers-pack 1.0.0

.

prompt:String

The text displayed by the text input when no item is selected.

The following example sets the combo box's prompt:

gridComboBox.prompt = "Select an item";
Available since

feathersui-data-containers-pack 1.0.0

.

@:bindable("change")selectedIndex:Int

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

  • feathers.core.IIndexSelector.selectedIndex Note: If the selectedIndex is -1, it's still possible for the selectedItem to not be null. This can happen when a custom value is entered into the text input by the user.

@:bindable("change")selectedItem:Dynamic

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

  • feathers.core.IDataSelector.selectedItem Note: If the selectedItem is not null, and the selectedIndex is -1, the value of selectedItem is a custom value entered into the text input by the user.

textInputFactory:AbstractDisplayObjectFactory<Dynamic, TextInput>

Creates the text input, which must be of type feathers.controls.TextInput.

In the following example, a custom text input factory is provided:

gridComboBox.textInputFactory = () ->
{
	return new TextInput();
};
Available since

feathersui-data-containers-pack 1.0.0

.

See also:

  • feathers.controls.TextInput

Methods

closeGridView():Void

Closes the pop-up list, if it is open.

The following example closes the pop-up list:

if(gridComboBox.open)
{
	gridComboBox.closeGridView();
}

When the pop-up list closes, the component will dispatch an event of type Event.CLOSE.

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

dynamicitemToText(data:Dynamic):String

Converts an item to text to display within the pop-up GridView, or within the Button, if the item is selected. By default, the toString() method is called to convert an item to text. This method may be replaced to provide custom text.

This function is not called if the item is already a string.

For example, consider the following item:

{ text: "Example Item" }

If the GridView should display the text "Example Item", a custom implementation of itemToText() might look like this:

gridComboBox.itemToText = (item:Dynamic) -> {
	return item.text;
};
Available since

feathersui-data-containers-pack 1.0.0

.

openGridView():Void

Opens the pop-up list, if it is not already open.

The following example opens the pop-up list:

if(!gridComboBox.open)
{
	gridComboBox.openGridView();
}

When the pop-up list opens, the component will dispatch an event of type Event.OPEN.

Available since

feathersui-data-containers-pack 1.0.0

.

See also:

dynamictextToItem(text:String):Dynamic

Called when none of the items in the data provider match the custom text typed by the user. By default, returns the original string, without any changes.

For example, consider the following item type:

{ text: "Example Item" }

A custom implementation of textToItem() might look like this:

gridComboBox.textToItem = (customText:String) -> {
	return { text: customText };
};
Available since

feathersui-data-containers-pack 1.0.0

.

See also: