jQuery avec selectOneRadio de primefaces

Version imprimable

Bonjour

j'ai une page jsf contenant un selectOneRadio et je veux associer à chaque valeur selectionée une fonction jquery.

Code:

1
2
3
4
5
6
7
8
<h:panelGrid columns="2" style="margin-bottom:10px" cellpadding="5">
    <p:outputLabel for="console" value="Console:" />
    <p:selectOneRadio id="console" value="#{lotBean.model.type_lot}">
        <f:selectItem itemLabel="Xbox One" itemValue="Xbox One"  />
        <f:selectItem itemLabel="PS4" itemValue="PS+" />
        <f:selectItem itemLabel="Wii U" itemValue="Wii U" />
    </p:selectOneRadio> 
</h:panelGrid>

avez une idée aidez-moi et merci

20/05/2014, 09h29
OButterlin
Je ne vois pas trop l'intérêt, un radio ne peut prendre qu'une seule valeur, donc c'est à la soumission (ou sur l'appui d'un bouton) que tu vas déclencher telle ou telle fonction, un simple teste de la valeur en cours du radio te permet d'aiguiller
Code:

1 2 3 4 5 6 7 8 9 function rooter() { var value = $('input[name="radio1"]:checked').val(); if (value == 1) maFonction1(...); else if (value == 2) maFonction2(...); etc... }

reponse

Bonjour OButterlin

mon code xhtml complet est :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<h:form id="form">
 
        <p:panel id="panel" header="New Lotissement">
 
            <p:messages id="msgs" />
 
            <h:panelGrid columns="9">
                <h:outputLabel for="name" value="name *" />
                <p:inputText id="name" value="#{myBean.model.name}"
                    required="true" label="name" style="margin-left:87px;">
                    <f:validateLength minimum="2" />
                </p:inputText>
                <!--  <p:message for="designation" display="icon"/>  -->
 
 
                <h:outputLabel for="lastName" value="lastName *"
                    style="margin-left:21px;" />
                <p:inputText id="lastName" value="#{myBean.model.lastName}"
                    label="lastName" required="true" style="margin-left:100px;">
                    <f:validateLength minimum="2" />
 
                </p:inputText>
 
 
 
 
            <h:panelGrid id="panelRadio" columns="2" style="margin-bottom:10px" cellpadding="5">
                <h:outputText value="Type de Lot:" />
                <p:selectOneRadio id="typePerson" value="#{myBean.model.type_lot}"
                    onchange="addNew(this.value);">
                    <f:selectItem itemLabel="Lot individuel "
                        itemValue="Lot individue " />
                    <f:selectItem itemLabel="Lot Collectif Equippement"
                        itemValue="Lot Collectif Equippement" />
 
                </p:selectOneRadio>
 
            </h:panelGrid>
 
            <h:panelGrid id="panelNew">
 
 
            </h:panelGrid>
 
            <p:commandButton value="Save" update="panel"
                action="#{myBean.save()}" rendered="true" />
        </p:panel>
    </h:form>

et je veux inserer des nouveaux composnat dans le panelNew et j'arrive pas a resoudre cette probleme .
mes noveaux composant sont :

Code:

1
2
3
4
5
<h:outputLabel for="designation" value="Designation: *" />  
        <h:inputText id="designation" value="#{lotissementBean.model.nom}" required="true" label="Designation" style="margin-left:87px;" />
 
<h:outputLabel for="description" value="Description: *"  style="margin-left:21px;"/>  
        <p:inputText id="description" value="#{lotissementBean.model.description}" label="Description" required="true" style="margin-left:100px;">

Aidez moi Svp et merci d'avance

20/05/2014, 15h13
OButterlin

Je ne comprends pas le besoin, peux-tu être plus précise ?
Tu veux que lorsque on sélectionne un élément radio, un "détail" s'affiche dans ton "panelNew" ? C'est ça ?
20/05/2014, 15h27
ITLEARNEAR

oui je veux lorsque on sélectionne un élément radio les deux label et les input text seront ajouter dans "panelNew"

Le plus simple est de mettre dans ton bean "myBean" les propriétés correspondant au contenu de ton panel.
Ton panel sera codé comme ceci dans la page

Code:

1
2
3
4
5
6
7
8
9
10
<h:panelGroup id="panelNew">
    <h:panelGrid rendered="#{myBean.laDesignation != null}">
        <h:outputLabel for="designation" value="Designation: *" />
        <h:inputText id="designation" value="#{myBean.laDesignation}" required="true" style="margin-left:87px;" />
     
        <h:outputLabel for="description" value="Description: *"  style="margin-left:21px;"/>  
        <p:inputText id="description" value="#{myBean.laDescription}" required="true" style="margin-left:100px;">    
    </h:panelGrid>
</h:panelGroup>

Ensuite, sur le radio, tu mets

Code:

1
2
<p:ajax event="change" immediate="true" listener="#{myBean.uneFonctionQuiMetAJourLes2Propriétés}" update="panelNew"/>

20/05/2014, 15h58
ITLEARNEAR

tu arrive pas a me comporendre ou bien tu sais pas me repondre je veux savour cette fonnction uneFonctionQuiMetAJourLes2Propriétés.

je veux juste savoir omment trouver le composnat panelNew avec javascrtip $('exression de panelNew') je veux savaoir comment selectionner panelNew en jquery et merci bien
20/05/2014, 16h24
OButterlin

$("#form:panelNew")