Question

我已经尝试（猜测）了许多可能的选项并进行了搜索，但是当按下按钮时我找不到如何检查创建的复选框。我知道我需要阅读更多内容而且我不会放弃，但如果有人可以提供帮助，我确实想继续前进，我想进入应用程序的下一部分。感谢

<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>

在脚本中，我可以在按下按钮时移动到下一个复选框

<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

我不确定我是否理解你想要的......

这是一个包含动态创建的复选框和一个检查它们的按钮的表单......

我撕掉了所有其他东西（这个例子不需要）

<!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访问创建的组件

1 个答案: