Semantic-Org/Semantic-UI · warning

<select> requires multiple property to be set to correctly p

Error message

<select> requires multiple property to be set to correctly preserve multiple values

What it means

setup.select() builds a dropdown from a <select>. If the select carries the 'multiple' class but not the actual multiple property/attribute, it logs this and auto-sets prop('multiple', true) so multi-values are preserved. Non-fatal and self-corrected.

Source

Thrown at src/definitions/modules/dropdown.js:3796

  onHide        : function(){},

  /* Component */
  name           : 'Dropdown',
  namespace      : 'dropdown',

  message: {
    addResult     : 'Add <b>{term}</b>',
    count         : '{count} selected',
    maxSelections : 'Max {maxCount} selections',
    noResults     : 'No results found.',
    serverError   : 'There was an error contacting the server'
  },

  error : {
    action          : 'You called a dropdown action that was not defined',
    alreadySetup    : 'Once a select has been initialized behaviors must be called on the created ui dropdown',
    labels          : 'Allowing user additions currently requires the use of labels.',
    missingMultiple : '<select> requires multiple property to be set to correctly preserve multiple values',
    method          : 'The method you called is not defined.',
    noAPI           : 'The API module is required to load resources remotely',
    noStorage       : 'Saving remote data requires session storage',
    noTransition    : 'This module requires ui transitions <https://github.com/Semantic-Org/UI-Transition>'
  },

  regExp : {
    escape   : /[-[\]{}()*+?.,\\^$|#\s]/g,
    quote    : /"/g
  },

  metadata : {
    defaultText     : 'defaultText',
    defaultValue    : 'defaultValue',
    placeholderText : 'placeholder',
    text            : 'text',
    value           : 'value'
  },

View on GitHub (pinned to 597843ab84)

Solutions

1. Add the multiple attribute to the select: <select multiple class="ui dropdown">
2. Or leave it — the module auto-corrects, but fix the markup to silence the console warning

Example fix

<!-- before -->
<select class="ui dropdown multiple">
<!-- after -->
<select multiple class="ui fluid dropdown">

// Ensure a 'multiple' class on a <select> is backed by the attribute.
$('select.ui.dropdown, select.multiple').each(function () {
  if (!this.hasAttribute('multiple')) {
    console.warn('select has multiple class but no multiple attribute');
    this.setAttribute('multiple', '');
  }
});
$('select').dropdown();

When it happens

Trigger: Markup like <select class="ui dropdown multiple">... without the real multiple attribute, i.e. class-based styling used instead of the attribute.

Common situations: Copying class-based markup instead of <select multiple>; partial markup migration that dropped the attribute.

Related errors

• Once a select has been initialized behaviors must be called
• There was an error contacting the server
• You called a dropdown action that was not defined
• Allowing user additions currently requires the use of labels
• The method you called is not defined.

AI-assisted analysis of Semantic-Org/Semantic-UI@597843ab84 (2026-08-13). Data as JSON: /api/errors/74cc487f0e47fdf2. Report an issue: GitHub.