Search code examples
polymer-1.0paper-elements

paper-listbox with strings?


instead of dealing with ints, it seems that i am receiving a string from the database.... that i need to compare against for the DDL i am working with. That being said, say i pass in: selected="{{type}}"

When trying to do something like:

 <paper-item value="Internal">Internal</paper-item>

it was throwing an error type 'int' is not a subtype of type 'String' of 'value'

Here is my current implementation, where type is String "External"

<paper-dropdown-menu label="Type" value="{{type}}" no-animations="true">
  <paper-listbox class="dropdown-content" selected="{{type}}">
    <paper-item value="Internal">Internal</paper-item>
    <paper-item value="External">External</paper-item>
  </paper-listbox>
</paper-dropdown-menu>

Ideally: It will want to populate it with the current value by setting that to selected.

I also tried it without paper-item having values.

Edit: I noticed that paper-dropdown-menu.value is read only.... so I removed that. I also noticed that paper-listbox.selected is the correct value to assign, but it seems that despite selected="External", it doesnt select the second item at all.


Solution

  • When dealing with a string, if you want it to do as such:

    you would have to say: attr-for-selected="value" and then you will use selected and it will do comparisons on that against the target attribute. Here is an updated Markup.

    <paper-dropdown-menu label="Type" value="{{type}}" no-animations="true">
      <paper-listbox class="dropdown-content" 
          attr-for-selected="value" selected="{{type}}">
        <paper-item value="Internal">Internal</paper-item>
        <paper-item value="External">External</paper-item>
      </paper-listbox>
    </paper-dropdown-menu>