liveBook · Manning

Dropdown

As explained in Build a Website with ChatGPT

A dropdown list is a selection-list interface that initially shows a compact field and reveals its available choices when activated.

A select element presents several choices in a compact field. Activating it reveals the available options, making it useful when radio buttons would take too much space. section 8.3.7

Configure a selection list by specifying:

Filtering a course catalog

Use Department and Instructor selection lists populated with unique field values. Selecting a department replaces the displayed records with matching courses; selecting the initial “All” option restores every record. section 13.4.2

Sorting displayed records

A Sort list can offer “Sort by Department” and “Sort by Title.” JavaScript sorts the records by the selected field and redisplays them. section 13.4.3

A selection list with the label "Philosophers You've Read" and the following options: "Plato", "Aristotle", "Blaise Pascal", "Friedrich Nietzsche", and "Jean-Paul Sartre." Allow the user to make multiple selections.

This concrete prompt demonstrates a labeled selection list that permits multiple choices. section 8.3.7

How Build a Website with ChatGPT covers it

How deep it goes
Explains display behavior and customization, then connects selection events to filtering or sorting; it stops short of implementation details.
Examples
Demonstrates animal, mood, philosopher, vacation, department, instructor, and course-sorting lists.
What it assumes
Assumes no coding knowledge for generated pages while requiring prepared course-catalog content, styling choices, and JSON data.
What you can do after
Operate/configure selection lists with chosen options, defaults, multiple selections, row sizes, filtering, and sorting behavior.
How it connects
Connects selection lists with forms, radio buttons, filtering, sorting, JavaScript, JSON data, and search controls.

Also explained in

Compare how 10 books explain dropdown →

Related concepts

This explainer was generated by Manning's knowledge graph from the text of Build a Website with ChatGPT. The section links point to the parts of the book it draws on.