Primefaces 开关 p:autoComplete 值答案

【问题标题】：Primefaces switch p:autoComplete valuesPrimefaces 开关 p:autoComplete 值
【发布时间】：2013-09-13 10:36:28
【问题描述】：

我的面板上有两个用于输入的 p:autoComplete 字段，如下所示。输入 1“contactName1”在左侧，输入 2“contactname2”在右侧。选择 ID 为“flipInput”的命令按钮时，应切换所选输入值。（就像在谷歌地图中切换源值和目标值一样）。我是 primefaces 的新手，所以不确定是否要实现它。请帮我解决它。

    <p:column colspan="2" rendered="#{empty contactController.selectedContact}">
                                <p:autoComplete id="contactName1"
                                    value="#{newContactRs.contact}"
                                    completeMethod="#{contactRelationshipController.completeContacts}"
                                    var="contact" itemLabel="#{contact.fullName}"
                                    itemValue="#{contact}" converter="#{contactConverter}"
                                    forceSelection="true" size="35" scrollHeight="200"
                                    panelStyle="width:10px;">
                                    <p:ajax event="itemSelect" update="contactName1" />
                                </p:autoComplete>
                                <p:commandButton icon="ui-icon-arrow-2-e-w" id="flipButton"/>
                                <smith:contactSelector value="#{newContactRs.contact}" update=":addContactRelationshipForm:addNewContactRelationshipPanel" triggerId="existingContactSelector1"
                                            resultList="#{contactRelationshipController.selectAllContact1}"/>

                            </p:column>
<p:column colspan="2">
                            <p:autoComplete id="contactName2"
                                value="#{newContactRs.relatedContact}"
                                completeMethod="#{contactRelationshipController.completeContacts}"
                                var="contact" itemLabel="#{contact.fullName}"
                                itemValue="#{contact}" converter="#{contactConverter}"
                                forceSelection="true" size="35" scrollHeight="200"
                                panelStyle="width:10px;">
                                <p:ajax event="itemSelect" update="contactName2" />
                            </p:autoComplete>
                            <smith:contactSelector value="#{newContactRs.relatedContact}" update=":addContactRelationshipForm:addNewContactRelationshipPanel" triggerId="existingContactSelector2"
                                        resultList="#{contactRelationshipController.selectAllContact2}"/>
                        </p:column>

【问题讨论】：

标签： java javascript jquery jsf primefaces

【解决方案1】：

添加了以下javascript

function swapInput()
{
    var input_a =document.getElementById('addContactRelationshipForm:contactName1_input').value; 
    var input_b =document.getElementById('addContactRelationshipForm:contactName2_input').value;

    document.getElementById('addContactRelationshipForm:contactName1_input').value = input_b;
    document.getElementById('addContactRelationshipForm:contactName2_input').value = input_a;
}

并将命令按钮更改为

<p:commandButton icon="ui-icon-arrow-2-e-w" id="flipButton" 
styleClass="ui-panel-titlebar-icon" oncomplete="swapInput()" update="addNewContactRelationshipPanel" immediate="true"/>

【讨论】：