1

将单个页面上的这几个隐藏表单合并为一个大表单是否有意义？

提交属于特定表单process属性的特定参数集可用于提交需要处理的所有元素。

与使用多种表格相比，这种单一表格方法的优点/缺点是什么？

   <span class="hiddenForms">
        <h:form>
            <h:inputHidden id="selctdChnlType_in" value="#{channelCntlr.type}"/>
            <h:inputHidden id="selctdChnlId_in" value="#{channelCntlr.channelId}"/>
            <p:remoteCommand name="updateChnlDataPanel" process="@form" actionListener="#{channelCntlr.init()}" update=":channelHeader, :channelDataPanel, :channelSideColumn"/>
        </h:form>

        <h:form>
            <h:inputHidden id="selctdLOBId_in" value="#{lobCntlr.targetLOBId}"/>
            <p:remoteCommand name="updateLOBPanel" process="selctdLOBId_in, @this" actionListener="#{lobCntlr.retrieveCurrentLOB()}" update=":lobFullContentPanel" />
        </h:form>

        <h:form id="lobAction_form" >
            <h:inputText id="targetLOBId_in" value="#{lobCntlr.targetLOBId}"/>
            <h:inputText id="targetResponseId_in" value="#{lobCntlr.targetResponseOrCommmentId}"/>
            <h:inputText id="targetAction_in" value="#{lobCntlr.targetAction}"/>
            <p:remoteCommand name="doLOBAction" process="targetLOBId_in, targetAction_in, targetResponseId_in,@this" actionListener="#{lobCntlr.doLOBAction()}"/>

            <h:inputText id="targetTopics" value="#{lobCntlr.list}" converter="listConverter"/>
            <p:remoteCommand name="suggestAsHotLOB" process="targetLOBId_in, targetTopics, @this" actionListener="#{lobCntlr.addForTryAsHotLOB()}"/>
        </h:form>

        <h:form id="comment_form" >
            <h:inputText id="targetLOBId_in" value="#{lobCntlr.targetLOBId}"/>
            <h:inputText id="targetCommentOrResponseId_in" value="#{lobCntlr.targetResponseOrCommmentId}"/>
            <h:inputText id="comment_in" value="#{lobCntlr.text_input}" required="true">
                <f:validateLength minimum="15" maximum="1000"/>
            </h:inputText>
            <h:inputText id="previousCommenters_in" value="#{lobCntlr.list}" converter="listConverter"/>

            <p:remoteCommand name="addComment" process="@form" actionListener="#{lobCntlr.addUserComment()}" oncomplete="addCommentToPage(args);" />
            <p:remoteCommand name="deleteComment" process="targetLOBId_in, targetCommentOrResponseId_in, @this" actionListener="#{lobCntlr.removeUserComment()}"  oncomplete="removeFromPage(args);" />
        </h:form>

        <h:form id="recosForm">
            <h:inputText id="startFromRecos_in" value="#{recmdnsCntlr.startFromIndex}"/>
            <p:remoteCommand name="fetchAllRecos" actionListener="#{recmdnsCntlr.retrieveAllRecmmndns()}" process="startFromRecos_in,howManyRecos_in,isLocalStorAvailble_in,@this" />
            <p:remoteCommand name="fetchFollowiesList" actionListener="#{recmdnsCntlr.fetchAllFollowiesList()}" process="@this" oncomplete="storeFollowiesList(args)"/>
        </h:form>

        <span id="editsForm" style="display:none">
            <form action="javascript:void(0);" class="edits_submitter" >
                <p:inputTextarea styleClass="editedText"/>
                <input type="submit" value="Save edits"/>
                <a class="cancel-edit" href="javascript:void(0)">Cancel</a>
            </form>
        </span>

    </span>
4

2 回答 2

5

单一、单一的 JSF 表单控件的一个主要缺点是（不必要地）发送到服务器进行处理的数据量很大。使用您现有的代码。考虑以下。如果所有控件都在一个表单中，那么您将<h:form id="lobAction_form" >拥有<h:form id="comment_form" >

     <h:inputText id="targetLOBId_in" value="#{lobCntlr.targetLOBId}"/>
        <h:inputText id="targetResponseId_in" value="#{lobCntlr.targetResponseOrCommmentId}"/>
        <h:inputText id="targetAction_in" value="#{lobCntlr.targetAction}"/>
        <p:remoteCommand name="doLOBAction" process="targetLOBId_in, targetAction_in, targetResponseId_in,@this" actionListener="#{lobCntlr.doLOBAction()}"/>

        <h:inputText id="targetTopics" value="#{lobCntlr.list}" converter="listConverter"/>
        <p:remoteCommand name="suggestAsHotLOB" process="targetLOBId_in, targetTopics, @this" actionListener="#{lobCntlr.addForTryAsHotLOB()}"/>
        <h:inputText id="targetLOBId_in" value="#{lobCntlr.targetLOBId}"/>
        <h:inputText id="targetCommentOrResponseId_in" value="#{lobCntlr.targetResponseOrCommmentId}"/>
        <h:inputText id="comment_in" value="#{lobCntlr.text_input}" required="true">
            <f:validateLength minimum="15" maximum="1000"/>
        </h:inputText>
        <h:inputText id="previousCommenters_in" value="#{lobCntlr.list}" converter="listConverter"/>

        <p:remoteCommand name="addComment" process="@form" actionListener="#{lobCntlr.addUserComment()}" oncomplete="addCommentToPage(args);" />
        <p:remoteCommand name="deleteComment" process="targetLOBId_in, targetCommentOrResponseId_in, @this" actionListener="#{lobCntlr.removeUserComment()}"  oncomplete="removeFromPage(args);" />
    </h:form>

对于您以该表单启动的每个命令操作，可能是为了处理 1 个输入文本组件，无论如何您总是将其中的所有 13 个组件发送到服务器。浪费和不必要的。对于小型操作，您将有大量的客户端-服务器通信，有时响应时间很慢。根据您使用的任何 JSF 框架，您可能能够在这种情况下发挥创造力，选择性地处理组件等等，但这只是不必要且痛苦的。清晰的关注点分离也在表示层中发挥作用。

然后是验证的问题。通常，您会在单个表单中选择组件，这些组件被标记为required并且与该表单中的其余组件无关。您很可能无法在不影响该表单上的所有其他组件的情况下选择性地处理这些组件。

于 2012-11-15T03:39:53.700 回答
0

我看到你正在使用primefaces。您可以考虑使用向导组件。有了这个组件，就有一个表单，在不同的选项卡中有更多的部分。当您从一个选项卡转到下一个选项卡时，验证是在 Ajax 模式下完成的。由于部分验证是使用 Ajax 完成的，因此只有您正在验证的选项卡的字段会被处理并发送到服务器。

将长表单拆分为更具可读性和用户友好性的部分也很有用。

于 2012-11-15T14:40:53.770 回答