Primefaces cambia p:autocompletar valores

I have two p:autoComplete fields for inputs on my panel as below. Input 1 "contactName1" is on left side and input2 "contactname2" is on right side.On selecting the command button with id "flipInput" the selected input values should switch.(Just like switching source and destination values in google maps). I am new to primefaces so am not sure not to get implement this. Please help me to fix it.

    <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>

preguntado el 09 de septiembre de 13 a las 21:09

1 Respuestas

Added following 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;
}

And changed the commandbutton as

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

Respondido el 10 de Septiembre de 13 a las 17:09

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.