聚合物，使用在AJAX型紙張輸入多行屬性

Question

我試圖使在Ajax的形式元素的多紙張輸入

#info { 
 
    width: 90%; 
 
    height: 300px; 
 
    background-color: white; 
 
    padding: 10px; 
 
    margin: 20px auto; 
 
} 
 

 
paper-input { 
 
    width: 100%; 
 
    height: 150px; 
 
}

<div id="info"> 
 
    <form is="ajax-form" action="../../../back/saveIMG.php" class="picturePost" method="post" enctype="multipart/form-data"> 
 

 
    <file-input camera name="pic" id="pic"> 
 
     <core-icon-button 
 
         icon="image:camera-alt"> 
 
     </core-icon-button> 
 
    </file-input> 
 
    <br/> 
 
    <paper-input multiline id="last" floatingLabel label="Commentaire" ></paper-input> 
 
    <!-- --> 
 
    <br/> 
 
    <input type="submit" name="submitInfo"> 
 
    </form> 
 
</div>

所以我添加一些屬性像maxRows="5"和rows="3"但我的紙張輸入始終是單行區域。

Answer 1

而不是使用一個paper-input的你應該考慮使用paper-input-decorator與paper-autogrow-textarea

<div id="info"> 
    <form is="ajax-form" action="../../../back/saveIMG.php" class="picturePost" method="post" enctype="multipart/form-data"> 

     <file-input camera name="pic" id="pic"> 
      <core-icon-button icon="image:camera-alt"></core-icon-button> 
     </file-input> 
     <br/> 
     <paper-input-decorator id="last" label="Commentaire"> 
      <paper-autogrow-textarea rows="3" maxRows="5"> 
       <textarea></textarea> 
      </paper-autogrow-textarea> 
     </paper-input-decorator> 
     <!-- --> 
     <br/> 
     <input type="submit" name="submitInfo"> 
    </form> 
</div> 

Answer 2

而不是paper-input嘗試使用iron-autogrow-textarea：

<iron-autogrow-textarea id="last" rows="3" maxRows="5" bind-value="{{xyz}}"> 
</iron-autogrow-textarea> 

文檔：https://elements.polymer-project.org/elements/iron-autogrow-textarea