Search code examples
polymerpolymer-2.xpaper-elements

Polymer 2.x paper-radio-group selectedValues not working

I am trying to work with the selectedValues property of a paper-radio-group (using the multi option). According to documentation, this property should be a setter and a getter to the selected radio buttons. But it does not seem to work.

enter image description here

I have made a plunker to test it: https://embed.plnkr.co/6YK15vgv33IX2ZqYHmpQ/

As you can see the red and white should be selected. But they don't. Also when you start selecting items, the selectedValues is never fired.

<paper-radio-group multi selectedValues="[0,3]">
      <paper-radio-button>Red</paper-radio-button>
      <paper-radio-button>Green</paper-radio-button>
      <paper-radio-button>Blue</paper-radio-button>
      <paper-radio-button>White</paper-radio-button>
      <paper-radio-button>Purple</paper-radio-button>
</paper-radio-group>
Solution

  • Your binding of selectedValues needs to be dash-cased (selected-values)):

    <paper-radio-group selected-values="[0,3]">

    And the <paper-radio-button>s need their name attributes set to match the selected values:

    <paper-radio-button name="0">Red</paper-radio-button>
<paper-radio-button name="1">Green</paper-radio-button>
<paper-radio-button name="2">Blue</paper-radio-button>
<paper-radio-button name="3">White</paper-radio-button>
<paper-radio-button name="4">Purple</paper-radio-button>

    demo