Skip to content
This repository has been archived by the owner on Mar 13, 2018. It is now read-only.

When used in a small dialog, dropdown doesnt layer outside the dialog.. #26

Closed
mwinters-stuff opened this issue Nov 4, 2014 · 1 comment

Comments

@mwinters-stuff
Copy link

When used in a small dialog, dropdown doesnt layer outside the dialog..

Ie, create a dialog

<paper-dialog id="edit_sensor_dialog" heading="{{dialogSensor.id == null ? 'New' : 'Edit'}} Sensor" transition="paper-transition-center">
      <div id="sensor_edit_form" layout vertical>
        <paper-input id="input_sensor_name" label="Name" floatingLabel="true" value="{{dialogSensor.name}}" required="true">
        </paper-input>
        <paper-dropdown-menu id="input_sensor_type" valueattr="id" label="Sensor Type" selected="{{dialogSensor.type}}" >
          <template repeat="{{type in sensorTypes}}">
            <paper-item id="{{type.name}}" label="{{type.caption}}"</paper-item>
          </template>
        </paper-dropdown-menu>
      </div>
      <paper-button id="buttonCancel"  dismissive>Cancel</paper-button>
      <paper-button id="buttonOk" affirmative on-tap="{{sensorButtonOkTapped}}">Ok</paper-button>
    </paper-dialog>

The sensorTypes array has > 10 items, the dropdown will show within the dialog/div causing scrollbars to appear. The dropdown should be able to show outside the dialogs bounds..

image

image

@morethanreal
Copy link

In the next release, you can use the layered property in paper-dropdown for this use case.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants