select function

Component select(
  1. List<Component> children, {
  2. String? name,
  3. bool? multiple,
  4. bool? required,
  5. bool? disabled,
  6. bool? autofocus,
  7. String? autocomplete,
  8. int? size,
  9. ValueChanged<List<String>>? onInput,
  10. ValueChanged<List<String>>? onChange,
  11. Key? key,
  12. String? id,
  13. String? classes,
  14. Styles? styles,
  15. Map<String, String>? attributes,
  16. Map<String, EventCallback>? events,
})

The <select> HTML element represents a control that provides a menu of options.

  • name: This attribute is used to specify the name of the control.
  • multiple: Indicates that multiple options can be selected in the list. If it is not specified, then only one option can be selected at a time. When multiple is specified, most browsers will show a scrolling list box instead of a single line dropdown.
  • required: Indicating that an option with a non-empty string value must be selected.
  • disabled: Indicates that the user cannot interact with the control. If this attribute is not specified, the control inherits its setting from the containing element, for example <fieldset>; if there is no containing element with the disabled attribute set, then the control is enabled.
  • autofocus: This attribute lets you specify that a form control should have input focus when the page loads. Only one form element in a document can have the autofocus attribute.
  • autocomplete: A string providing a hint for a user agent's autocomplete feature.
  • size: If the control is presented as a scrolling list box (e.g. when multiple is specified), this attribute represents the number of rows in the list that should be visible at one time. Browsers are not required to present a select element as a scrolled list box. The default value is 0.
  • onInput: Callback for the 'input' event.
  • onChange: Callback for the 'change' event.

Implementation

Component select(List<Component> children,
    {String? name,
    bool? multiple,
    bool? required,
    bool? disabled,
    bool? autofocus,
    String? autocomplete,
    int? size,
    ValueChanged<List<String>>? onInput,
    ValueChanged<List<String>>? onChange,
    Key? key,
    String? id,
    String? classes,
    Styles? styles,
    Map<String, String>? attributes,
    Map<String, EventCallback>? events}) {
  return DomComponent(
    tag: 'select',
    key: key,
    id: id,
    classes: classes,
    styles: styles,
    attributes: {
      ...attributes ?? {},
      if (name != null) 'name': name,
      if (multiple == true) 'multiple': '',
      if (required == true) 'required': '',
      if (disabled == true) 'disabled': '',
      if (autofocus == true) 'autofocus': '',
      if (autocomplete != null) 'autocomplete': autocomplete,
      if (size != null) 'size': '$size',
    },
    events: {
      ...?events,
      ..._events(onInput: onInput, onChange: onChange),
    },
    children: children,
  );
}