InputTextArea文本溢出

Question

我对primefaces inputTextArea有一个小问题。如果文本长于指定的面板高度，则文本会在我的下一个面板后面溢出。一旦我点击进入textarea，问题就消失了，但是在查看页面时，它看起来很丑，就像你在下面的图片中看到的那样。

这里是我的XHTML代码：

<!-- **************************** INITIAL DETAILS **************************** --> 
       <p:panel header="Initial Details" style="width:480px;height:300px;"> 
        <p:inplace emptyLabel="--empty--" id="ajaxInplaceInitialDetails" editor="true"> 
         <p:ajax event="save" listener="#{bigComplaintsDAO.handleEditSave}"   update=":messages" /> 

         <p:inputTextarea rows="10" cols="47" maxlength="5000" autoResize="false" 
          value="#{bigComplaintsDAO.selectedComplaintRow.initialdetails}" 
          required="true" label="text" queryDelay="750" minQueryLength="4" /> 
        </p:inplace> 
       </p:panel> 
       <br/> 
       <!-- **************************** ADD NEW NOTES ******************************* --> 
       <p:panelGrid columns="1" cellpadding="5" style="width:450px;height:200px;"> 


        <p:panel header="Add New Note"> 
         <h:outputText value="Subject: *" /> 
         <p:inputText id="subjectNew" 
          value="#{bigComplaintsDAO.newNoteSubject}" required="true" 
          label="Subject label"> 
          <f:validateLength minimum="2" /> 
         </p:inputText> 



         <p:inputTextarea id="bodyNew" rows="10" cols="47" maxlength="5000" 
          value="#{bigComplaintsDAO.newNoteBody}" required="true" 
          label="Body" queryDelay="750" minQueryLength="4"> 
         </p:inputTextarea> 
        </p:panel> 

        <p:commandButton value="Submit" 
         process="@this, subjectNew, bodyNew" 
         update=":messages, accordionPanelNotes, :messages" 
         actionListener="#{bigComplaintsDAO.addNewNote}" id="btnSubmit"> 
         <f:actionListener binding="#{bigComplaintsDAO.init()}" /> 
        </p:commandButton> 
       </p:panelGrid> 

是否有任何代码，我可以添加到inputTextArea将停止文本溢出面板？ 我使用Eclipse开普勒，Glassfish4.0，谷歌Chrome

感谢 感谢

Answer 1

解决它！ 但是为了防止别人遇到同样的问题，我就是这样做的。 我编辑的代码如下：

<p:panel header="Initial Details" style="width:480px;height:300px;"> 
       <p:scrollPanel style="width:465px;height:255px"> 

        <p:inplace emptyLabel="--empty--" id="ajaxInplaceInitialDetails" editor="true"> 
         <p:ajax event="save" listener="#{bigComplaintsDAO.handleEditSave}"   update=":messages" /> 

         <p:inputTextarea rows="10" cols="47" maxlength="5000" autoResize="false" 
          value="#{bigComplaintsDAO.selectedComplaintRow.initialdetails}" 
          required="true" label="text" queryDelay="750" minQueryLength="4" /> 
        </p:inplace> 

       </p:scrollPanel> 
       </p:panel> 
       <br/> 
       <!-- **************************** ADD NEW NOTES ******************************* --> 

我添加了一个滚动面板主面板然后本身调整了高度和宽度，以便它是齐平的内部里面。

上滚动面板

的更多信息可以在这里找到：

http://primefaces-rocks.appspot.com/ui/scrollPanel.jsf