聚合物，使用在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