Polymer accessing created components

Question

I have tried (guessed) many possible options and searched but I cannot find how to check the created checkboxes when a button is pressed. I know I need to read more and I won't give up but I do want to move on quickly if anyone can help, I want to get to the next part of the app. Thanks

<div id="divc">
    <core-selector target="{{$.myForm}}" itemsSelector="input[type=checkbox]" 
        selected="{{Index}}" valueattr="value" activateEvent="change">
    </core-selector>

    <form id="myForm">

    <template repeat="{{cItem, Index in carray}}"> 
        <label><input name="{{Index}}" type="checkbox" value="{{Index}}">            {{cItem._Ffield}}</label> <br> 
    </template> 

    </form>

 </div>

In the script I can move to the next checkbox when the button is pressed

<script>

Polymer('my-element', {
    created: function()
    {
        this.Index = 0;
    },
    increment: function(e){
        //would like to check the checkbox before moving to the next, I thought it would be easy but nothing seems to work.

        this.Index++;  //move to next
    }

});

</script>

Answer 1

I'm not sure if i understand what u want exactly...

Here is a form with dynamicly created checkboxes and a button that checks them ...

I ripped out all other stuff (not needed for this example)

<!doctype html>
<html>
<head>
  <script src="/components/platform/platform.js"></script>
  <style>
    body {
      font-family: Roboto, 'Helvetica Neue', Helvetica, Arial, sans-serif;
      margin: 0;
    }
  </style>
    <link rel="import" href="/components/polymer/polymer.html">
  <script>
  </script>
</head>
<body fullbleed unresolved>
 <my-element>  
 </my-element>  

 <polymer-element name="my-element"> 
    <template>
      <form id="myForm">
        <template repeat="{{cItem in carray}}"> 
            <label><input name="{{Index}}" type="checkbox">{{cItem}}</label> <br> 
        </template> 
        <input type="button" on-tap="{{checkAllBoxes}}" value="CHECK">
      </form>
    </template>
  <script> Polymer('my-element', { 
        created: function()
    {
        this.carray = ['a','b','c'];
    },
    checkAllBoxes: function(e){
      var c = this.shadowRoot.querySelectorAll('input[type=checkbox]');
      c.array().forEach(
        function(e,i,a) {e.checked = true;}
      );
    },
}); 
  </script>
</polymer-element>  

</body>

</html>

Polymer accessing created components

Question

1 answers

solution1
0 2014-08-14 20:03:24

Polymer accessing created components

Question

1 answers

solution1 0 2014-08-14 20:03:24

solution1
0 2014-08-14 20:03:24