Help Center

Local Navigation

Best practice: Implementing drop-down lists

  • Use a drop-down list for two or more choices when space is an issue. If space is not an issue, consider using radio buttons instead so that users can view the available options on the screen.
  • Use the ObjectChoiceField or NumericChoiceField class to create drop-down lists.
  • For the default value, use the value that users are most likely to click.
  • Use the highlighted option as the default focus when users scroll through the list.
  • If users are not required to click a value, include a "None" value in the drop-down list. Always place the "None" value at the top of the list.
  • Group and order values logically (for example, group related values together or include the most common values first). Avoid ordering values alphabetically; alphabetical order is language specific.

Guidelines for labels

  • Use clear, concise labels for drop-down lists and for the values in drop-down lists. Verify that the label clearly describes what occurs when users click the value. The width of the drop-down list changes based on the length of the value labels. If a label is too long, an ellipsis (...) appears to indicate that the text is truncated.
  • Avoid using the labels "Yes" and "No" as drop-down list values. Rephrase the option and use a check box instead.
  • Place the label on the left side of a drop-down list.
  • Use title case capitalization for drop-down list labels and values (unless the values read more like a sentence).
  • Punctuate labels for drop-down lists with a colon (:).
Previous topic: Drop-down lists

Was this information helpful? Send us your comments.