DropDownChoiceUI

This will create a drop-down box with a list of choices to be selected.

Parameters

none

Attributes

• .getF( f:()=>string) – The function f will be called whenever the component is rerendered. It should return the selectCode for the choice that is currently displayed.
• .setF( f:(selectCode:string)=>void) – the function f will be called whenever the user interactively makes a new choice.
• .choice( selectCode:string, label:string) – this can be called repeatedly to add choices to this component. The selectCode is the code to uniquely identify this choice within the code. The label is the text to be shown to the user for that choice.
• .readonly(readonly:true) – if this is set to true then the button will be displayed but inactive and non-responsive. The default is false. This is for displaying a stylistically consistent but inactive user interface.

Examples

let currentSelection = "P";
new DropDownChoiceUI()
     .getF(()=>{ return currentSelection; })
     .setF((select:string)=>{
          currentSelection = select;
          update the selection in the code
     })
     .choice("D","Dog")
     .choice("P","Pig")
     .choice("H","Hippopotamus");

This creates a drop-down with 3 choices: Dog, Pig and Hippopotamus. Initially the Pig choice is shown.

Styling

• DropDownChoiceUI – the default styling for the drop-down box itself.