InputTextArea 文本溢出答案

【问题标题】：InputTextArea text overflowInputTextArea 文本溢出
【发布时间】：2014-05-22 12:00:25
【问题描述】：

我对 primefaces inputTextArea 有一个小问题。如果文本长于指定的面板高度，则文本会溢出到我的下一个面板后面。单击文本区域后，问题就消失了，但是在查看页面时，它看起来很丑，如下图所示。

这是我的 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、谷歌浏览器

谢谢谢谢

【问题讨论】：

标签： html eclipse jsf primefaces textarea

【解决方案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

【讨论】：