input fields in polymer

component.html

<polymer-element name="my-checkbox" attributes="name value checked">
  <template> <!-- main template, renders to shadow root --></template>
  <template id="foo">
    <input type="hidden" name="{{name}}" value="{{checked ? value : 0}}" />
  </template>
  <script>
    (function() {
      Polymer('my-checkbox', {
        ready: function() {
          // this.element is `polymer-element`
          var template = this.element.querySelector('#foo');
          // set up the magic to use bindings
          var dom = this.instanceTemplate(template);
          // will be appended outside of shadow root
          this.appendChild(dom);
        }
    });
  </script>
</polymer-element>