Hi
I have an example that is using ajaxZones to allow the user to select a
fruit from a list of radio buttons, causing the values in a menu to
change to list some varieties on the chosen fruit. When the user
selects a variety, an output component is supposed to show some
information about that fruit variety.
What I have in the page is the following. I was trying to follow the
example given in the tlddoc for collectPostData. When I click on the
radio buttons or the menu, nothing happens. My listeners are not called
either. Any ideas?
thanks.
Jennifer
<%@ taglib uri="
http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="
http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib prefix="jsfExt"
uri="
http://java.sun.com/jsf/extensions/dynafaces" %>
<f:view>
<html>
<head>
<title>DynaFaces JSP Blank App</title>
<jsfExt:scripts />
</head>
<body bgcolor="white">
<h:form id="form">
<h1>DynaFaces JSP Blank App</h1>
<jsfExt:ajaxZone id="zone1" eventType="onChange" collectPostData="handler">
<h:panelGrid columns="2">
<h:selectOneRadio id="fruit" value="#{fruitInfoBean.fruit}"
valueChangeListener="#{fruitInfoBean.changeFruit}">
<f:selectItems value="#{fruitInfoBean.fruits}"/>
</h:selectOneRadio>
<h:selectOneMenu id="variety" value="#{fruitInfoBean.variety}"
valueChangeListener="#{fruitInfoBean.updateVariety}">
<f:selectItems value="#{fruitInfoBean.varieties}"/>
</h:selectOneMenu>
</h:panelGrid>
</jsfExt:ajaxZone>
<jsfExt:ajaxZone id="zone2">
<h:outputText id="varietyInfo" value="#{fruitInfoBean.varietyInfo}" />
</jsfExt:ajaxZone>
</h:form>
<script type="text/JavaScript">
function handler(ajaxZone, element, outArray) {
var name = null, value = null;
var fruit = Document.getElementById('fruit');
var variety = Document.getElementById('variety');
var elementNodeName = fruit.nodeName.toLowerCase();
var elementType = fruit.type;
name = DynaFacesZones.getParamNameFromElement(fruit,
elementNodeName,
elementType);
value = DynaFacesZones.getParamValueFromElement(fruit,
elementNodeName,
elementType);
outArray.push(name+'='+value);
var elementNodeName = variety.nodeName.toLowerCase();
var elementType = variety.type;
name = DynaFacesZones.getParamNameFromElement(variety,
elementNodeName,
elementType);
value = DynaFacesZones.getParamValueFromElement(variety,
elementNodeName,
elementType);
outArray.push(name+'='+value);
}
</script>
</body>
</html>
</f:view>