JSF et AJAX (recuperer la valeur d'un champs ajax)
Bonjour à tous,
J'ai un souci pour récuperer la valeur d'un champs d'une liste déroulante en ajax.
J'ai un formulaire dans ma jsp, dedans il y a une liste déroulante et en fonction du choix dans cette liste, ca charge une autre liste déroule (en ajax). J'aime récupérer la valeur sélectionnée dans cette deuxième liste :
voici mon code de ma premier jsp : dcDemoAdd.jsp
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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
<script src="${pageContext.request.contextPath}/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("select[id$='brandName1']").change(function()
{
$("#category").empty();
$.ajax({
type: "GET",
url: "dcDemo_Category.jsp",
data: "brandId="+$("select[id$='brandName1']").val(),
datatype : "html",
success: function(html){
$("#category").append(html);
}
});
}
);
$("#category").empty();
$.ajax({
type: "GET",
url: "dcDemo_Category.jsp",
data: "brandId="+$("select[id$='brandName1']").val(),
datatype : "html",
success: function(html){
$("#category").append(html);
}
});
</script>
<hx:scriptCollector id="scriptCollector1">
<h:form styleClass="form" id="form1">
<table><tr>
<td align="left">Brand :</td>
<td style="width: 5px"> </td>
<td><h:selectOneMenu styleClass="inputText" id="brandName1"
>
<f:selectItems value="#{pc_AddDemo.listAllBrands}"
id="selectItems6" />
</h:selectOneMenu></td>
<td colspan="3" rowspan="1"></td>
</tr>
<tr>
<td align="left">Category :</td>
<td style="width: 5px"> </td>
<td>
<div id="category"></div>
</td>
<td colspan="3" rowspan="1"></td>
</tr>
</table>
<hx:commandExButton id="buttonCreateDemoAction1"
styleClass="commandExButton" type="submit" value="Submit"
action="#{pc_AddDemo.createDemoAction}">
</hx:commandExButton>
<hx:commandExButton type="reset" value="Reset"
styleClass="commandExButton" id="button1">
</hx:commandExButton>
</h:form>
</hx:scriptCollector> |
La deuxième liste se charge en ajax dans le div "category".
Voici ma page jsp où il y a la liste que je charge : dcDemo_Category.jsp
Code:
1
2
3
4
5
6
7
8
9
10
11
|
<hx:scriptCollector id="scriptCollector1">
<h:selectOneMenu styleClass="inputText" id="categoryName1"
value="#{pc_AddDemo.demo.categoryId.categoryName}">
<f:selectItems value="#{pc_AddDemo.listCategoriesByBrandId}"
id="selectItems7" />
</h:selectOneMenu>
</hx:scriptCollector> |
Mon chargement et ma fonction Ajax fonctionne très bien....ce que je souhaiterais, c'est dans mon action "buttonCreateDemoAction1" récuperer la valeur du champs de ma 2ème liste. J'essaye avec :
Code:
1
2
3
4
5
6
|
HtmlSelectOneMenu categoryName1 = (HtmlSelectOneMenu) FacesContext.getCurrentInstance().getViewRoot().findComponent("form1:categoryName1");
System.out.println(">>>> CREATE DEMO categoryName1 :"+categoryName1.getValue().toString());
UIComponent monComponent = (UIComponent) FacesContext.getCurrentInstance().getViewRoot().findComponent("form1:categoryName1");
System.out.println(">>>> CREATE DEMO categoryName1 :"+monComponent.toString()); |
Mais ca me renvoie null !!
Si vous avez une solution pour m'aider, je suis preneur !
