InputTextArea文本溢出

时间:2014-04-09 10:34:42

标签: html eclipse jsf primefaces textarea

我对primefaces inputTextArea有一个小问题。如果文本长于指定的面板高度,则文本会在我的下一个面板后面溢出。一旦我点击textarea,问题就会消失,但是当查看页面时,它看起来很难看,如下图所示。

enter image description here

这是我的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 kepler,Glassfish4.0,Google Chrome

由于 感谢

1 个答案:

答案 0 :(得分:0)

解决了! 但是,以防其他人在这里遇到同样的问题就是我所做的。 我按如下方式编辑了代码:

<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