<iron-label> not forwarding taps to <paper-radio-button>

118 Views Asked by At
<div class="center horizontal layout">
      <iron-label>
        paper radio button
        <paper-radio-button noink iron-label-target>Radio</paper-radio-button>
      </iron-label>
</div>

Clicking on text paper radio button not forwarding clicks to the radio button but the documentation says: All taps on the iron-label will be forwarded to the "target" element.

1

There are 1 best solutions below

2
On BEST ANSWER

It's working in this JS Bin for me.

<!doctype html>
<html>

<head>
  <meta name="description" content="http://stackoverflow.com/questions/37816458">
  <meta charset="utf-8">
  <base href="http://polygit.org/components/">
  <script href="webcomponentsjs/webcomponents-lite.min.js"></script>
  <link href="polymer/polymer.html" rel="import">
  <link href="iron-label/iron-label.html" rel="import">
  <link href="paper-radio-button/paper-radio-button.html" rel="import">
</head>

<body>
  <dom-module id="my-el">
    <template>
      <iron-label>
        clicking here should forward tap to paper-radio-button
        <paper-radio-button noink iron-label-target on-tap="radioButtonTapped">Radio</paper-radio-button>
      </iron-label>
    </template>
    <script>
      Polymer({
        is: 'my-el',
        radioButtonTapped: function (e) {
          console.log('tap');
        }
      });
    </script>
  </dom-module>
  <my-el></my-el>
</body>

</html>

https://jsbin.com/juzewi/edit?html,console,output