1

私は次のJSFコードを持っています:

<p:selectOneRadio id="contactPersonGender" value="#{myBean.contactPersonGender}"> 
    <f:selectItems value="#{data.getGenders()}" var="gender" itemValue="#{gender}" itemLabel="#{gender.label}" />
</p:selectOneRadio>

<p:commandButton onclick="copyFromContactToManager();" ajax="false" type="button" update="@form"/>

<p:selectOneRadio id="managerGender" value="#{myBean.managerGender}">   
        <f:selectItems value="#{data.getGenders()}" var="gender" itemValue="#{gender}" itemLabel="#{gender.label}" />
</p:selectOneRadio>

ボタンがクリックされたときに contactPersonGender から managerGender に選択をコピーしたいと思います。data.getGenders() は、列挙型「Gender」(MALE または FEMALE) の配列を返します。たとえば、contactPersonGender で FEMALE が選択されている場合、ボタンがクリックされたときに managerGender も FEMALE を選択する必要があります。

私は次のコードを試しました：

function copyFromContactToManager(){
    $("input[id^='" + contactPersonGender + "']").each(function(index, element) {
        if ($(element).prop("checked")) {
                $("input[id^='managerGender:" + index + "']").first().click();
        }
    });
}

また：

function copyFromContactToManager(){
    $("input[id^='" + contactPersonGender + "']").each(function(index, element) {
        $("input[id^='managerGender:" + index + "']").prop("checked", $(element).prop("checked"));
    }
}

どちらも機能しますが、私のボタンをクリックした後、UI は更新されません (たとえば、contactPersonGender で "MALE" が選択され、managerGender で "FEMALE" が選択されている場合、managerGender でボタンをクリックした後、"FEMALE" はまだ表示されます)。しかし、フォームをサーバーに送信してデータを保持すると、managerGender の期待値は "MALE" になります)。

4

1 に答える 1

2

あなたは簡単な仕事をしようとしていますが、あなたが持っているコードは無関係です. これを行うためにJSは必要ありません。

ここで提供している例を見てください

XHTML コード

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui">

<h:head>


</h:head>


<h:body>

    <style media="screen" type="text/css">
.ui-widget,.ui-widget .ui-widget {
    font-size: 90% !important;
}
</style>


    <h:form>
        <p:panel header="Contact Person">
            <h:panelGrid columns="2">
                <h:outputText value="Select Gender"></h:outputText>
                <p:selectOneRadio id="contactPersonGender"
                    value="#{testBean.contactPersonGender}">
                    <f:selectItems value="#{testBean.genders}" var="gender"
                        itemLabel="#{gender.name}" />
                </p:selectOneRadio>
            </h:panelGrid>
        </p:panel>
        <p:separator></p:separator>
        <p:commandButton value="Copy to Manager"
            actionListener="#{testBean.copyToManager}" update="managerPanel"></p:commandButton>
        <p:separator></p:separator>
        <p:panel header="Manager Person" id="managerPanel">
            <h:panelGrid columns="2">
                <h:outputText value="Select Gender"></h:outputText>
                <p:selectOneRadio id="managerGender"
                    value="#{testBean.managerGender}">
                    <f:selectItems value="#{testBean.genders}" var="gender"
                        itemLabel="#{gender.name}" />
                </p:selectOneRadio>
            </h:panelGrid>
        </p:panel>


    </h:form>

</h:body>
</html>

ManagedBean

package reg.bean;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.event.ActionEvent;

@ManagedBean(name = "testBean")
@ViewScoped
public class TestBean {

    private GENDER contactPersonGender;
    private GENDER managerGender;
    private GENDER[] genders;

    public TestBean() {
        genders = GENDER.values();
    }

    public void processForm(ActionEvent event) {
        System.out.println("Contact person Gender " + contactPersonGender.getName());
        System.out.println("Manager Gender " + managerGender.getName());
    }

    public void copyToManager(ActionEvent event){
        this.managerGender=this.contactPersonGender;
    }

    public GENDER[] getGenders() {
        return genders;
    }

    public void setGenders(GENDER[] genders) {
        this.genders = genders;
    }

    public GENDER getContactPersonGender() {
        return contactPersonGender;
    }

    public void setContactPersonGender(GENDER contactPersonGender) {
        this.contactPersonGender = contactPersonGender;
    }

    public GENDER getManagerGender() {
        return managerGender;
    }

    public void setManagerGender(GENDER managerGender) {
        this.managerGender = managerGender;
    }
}

性別クラス ENUM

package reg.bean;

public enum GENDER {
    MALE("Male"), FEMALE("Female");
    private String name;

    GENDER(String name) {
        this.name = name;
    }

    public String getName() {
        return this.name;
    }
}

ここで、contact person で MALE を選択し、manager で FEMALE を選択すると、ボタンを押すと manager が FEMALE になります。UIが更新されます。

出力

于 2014-02-09T16:09:56.510 に答える