Combining core-list and paper-menu-button

[dominik0711]

According to the Material design paper it would be great to support list controls like paper-menu-button.

When I try to combine these elements the dropdown menu is hidden by the other rows because the paper-menu-button element is contained inside one list entry (see attached screenshot):

Or is there another way to add action buttons to lists?

[morethanreal]

If you're using the 0.5.x release, try the layered attribute on the paper-dropdown inside a paper-menu-button.

I think in the list case, it might be better to write some custom code to connect the buttons with a single paper-dropdown instead of creating multiple dropdowns for performance reasons. In that case you can also put the paper-dropdown in the top level so you don't need the layered attribute. e.g. http://jsbin.com/momicibifi/1/edit?html,output

[supermuka]

I have the same problem in Dart.

The menu-button items stay hidden by the other rows.

See the code:

<core-list-dart id="list" data="{{data}}">
    <template>
      <div horizontal layout>
        <div flex>
          <span>{{model['codigo']}}</span>         
          <span>{{model['descricao']}}</span>
        </div>
        <div>
          <paper-menu-button class="lista_botao_acao" icon="more-vert" selected="0">
            <paper-item icon="settings" label="Detalhe"></paper-item>
            <paper-item icon="create" label="Alterar"></paper-item>
            <paper-item icon="delete" label="Excluir"></paper-item>
          </paper-menu-button>
        </div>
      </div>  
    </template>
</core-list-dart>

Are there another form to do Action Button on line of List with Tags, without script?