Icefaces ajax Uncaught TypeError: Cannot read property 'ab'

Question

I am using Icefaces version 3.x. More specifically, this Eclpse plugin IF-3.3.0-IM-1.3.0-Eclipse-4.3-plugins-B in my Eclipse Kepler.

I am new to Icefaces and I am just playing around with the some code to learn more about this framework.

I keep getting the following error message. Can anybody please explain how to resolve this issue and the purpose of the function ice.ace.ab()? I tried to look it up but I couldn't find much information. Here are website that I've already read.

http://www.icesoft.org/wiki/display/ICE/Ajax

http://www.icesoft.org/wiki/display/ICE/Automatic+Ajax

Error

    Uncaught TypeError: Cannot read property 'ab' of undefined
        at HTMLSelectElement.onchange (dropdown_ace_ajax_attributes.jsf:10)
    onchange @ dropdown_ace_ajax_attributes.jsf:10

.xhtml page

    <?xml version='1.0' encoding='UTF-8' ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:f="http://java.sun.com/jsf/core"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:icecore="http://www.icefaces.org/icefaces/core"
        xmlns:ace="http://www.icefaces.org/icefaces/components">
    <h:head>
        <title>ICEfaces 3</title>
    </h:head>
    <h:body>

    <!-- http://www.icesoft.org/wiki/display/ICE/Ajax -->

        <h:form id="customForm" >
            <icecore:singleSubmit id="iceSubmitElement"/>
            <h:panelGrid columns="1">
                <h:selectOneMenu 
                    id="countries" 
                    label="Countries"
                    value="#{countryBean.selectedCountry}">
                        <f:selectItem noSelectionOption="true" itemLabel="Select..." />
                        <f:selectItems value="#{countryBean.countries}" />
                    <ace:ajax 
                        listener="#{countryBean.handleEvent}"
                        execute="@this" event="change" render="customForm.testOutput"
                        onStart="console.log('::::::::: onStart'); return true;"
                        onError="console.log('::::::::: onError : ' + error )"
                        onSuccess="console.log('::::::::: onSuccess : ' + data )"
                        onComplete=" console.log('::::::::: onComplete : ace:ajax change event '); ice.ace.ab({'source':'customForm:countries','execute':'customForm:countries','render':'customForm:testOutput','event':'change'});"
                     /> 
                </h:selectOneMenu>
                <h:outputText id="testOutput" value="#{countryBean.selectedCountry}" />
            </h:panelGrid>
        </h:form>

    </h:body>
    </html>

backing bean

    package com.test.beans;

    import java.util.ArrayList;
    import java.util.List;

    import javax.faces.bean.ManagedBean;
    import javax.faces.bean.ViewScoped;
    import javax.faces.component.UIOutput;
    import javax.faces.event.AjaxBehaviorEvent;
    import javax.faces.model.SelectItem;

    @ManagedBean
    @ViewScoped
    public class CountryBean {

        private String selectedCountry;
        private List<SelectItem> countries;

        public CountryBean() {
            System.out.println("countryBean created...");
            countries = new ArrayList<SelectItem>();

            countries.add(new SelectItem("Sweden"));
            countries.add(new SelectItem("Finland"));
            countries.add(new SelectItem("Norway"));
            countries.add(new SelectItem("Iceland"));
            countries.add(new SelectItem("Denmark"));
            countries.add(new SelectItem("Germany"));

        }

        // getters and setters
        public List<SelectItem> getCountries() {
            return countries;
        }
        public void setCountries(List<SelectItem> countries) {
            this.countries = countries;
        }
        public String getSelectedCountry() {
            return selectedCountry;
        }
        public void setSelectedCountry(String selectedCountry) {
            this.selectedCountry = selectedCountry;
        }

        public void changeCountry(AjaxBehaviorEvent event){
            System.out.println("CHANGE COUNTRY!>>>>>>>>>>>>>>>>>>>> " + selectedCountry);
            System.out.println("event : " + event.getComponent());
        }

        public void handleEvent(AjaxBehaviorEvent event){
            System.out.println("handleEvent called..");
            selectedCountry = (String) ((UIOutput) event.getSource()).getValue();
        }
    }

Icefaces ajax Uncaught TypeError: Cannot read property 'ab'

0 Answers0