Appearance

Menu ​

A dropdown menu input widget.

menu(options)

Return a new menu component with the provided options. Creates an instance of the Menu class, connects it to coordinator, and returns the corresponding HTML element.

The supported options are:

  • as: A Param or Selection that this menu should update. For a Param, the selected menu value is set to be the new param value. For a Selection, a predicate of the form column = value will be added to the selection.
  • filterBy: An optional selection by which to filter the content of the menu, if drawn from a backing table.
  • from: The name of the backing database table or view.
  • column: The backing database column this menu represents. If specified, the distinct column values will be queried to populate the menu.
  • label: A text label for the menu input. If unspecified, the column name (if provided) will be used by default.
  • format: An optional format function to transform values to strings for inclusion in the menu.
  • options: An explicit array of options to include in the menu. This option can be used instead of pulling values from a backing database table. Each option entry should consist of an object with label and value properties.
  • value: The initial value of the menu.
  • element: The container DOM element. If unspecified, a new div is created.

Examples ​

Create a new menu with options pulled from table.foo in the backing database:

js
menu({ from: "table", column: "foo", as: param })

Create a new menu with options provided explicitly:

js
menu({
  as: selection,
  options: [
    { label: "label1", value: "value1" },
    { label: "label2", value: "value2" },
    ...
  ]
})

new Menu(options)

Class definition for a menu input that extends MosaicClient. The constructor accepts the same options as the menu method.

element ​

menu.element

The HTML element containing the menu input.