Search code examples
polymermaterial-designpaper-elements

material design selectbox polymer


I noticed there were no "selectbox" widgets within the Paper Elements section of Polymer documentation, nor did I see one in the Polymer GitHub repos. Also I don't recall seeing any specific guidance on the Material Design specifications as to how a selectbox should look or behave.

Are there proposals out there? Or specific plans to incorporate designs for selectboxes within material design / polymer paper elements?

I definitely understand that you can basically get the same functionality from checkboxes (multi) or radio buttons (single), but from an aesthetic perspective, depending on the specific application, I get the feeling it may be a good idea to have 'select' available as an option.


Solution

  • You can use the paper-dropdown-menu, for example:

    <paper-dropdown-menu label="Favorite fruit" name="fruit">
        <paper-dropdown class="dropdown">
          <core-menu class="menu">
            <paper-item>apples</paper-item>
            <paper-item>oranges</paper-item>
            <paper-item>pears</paper-item>
          </core-menu>
        </paper-dropdown>
      </paper-dropdown-menu>