The ICEfaces Tutorial
Table of Contents


Lesson: Focus Management

How to Use the ICEfaces Focus Management API

The ICEfaces extended components provide a mechanism for requesting focus from your application.

The focus API consists of a single method, requestFocus(). This method is used to communicate a component focus request from the application to the client browser.

The following ICEfaces extended components have implemented the requestFocus method.


Basic Focus Management Example

Adding focus management to an ICEfaces application

In order to use the ICEfaces focus API in your application you must use component bindings in your application web pages.

The page markup used in this example is taken from focus.jspx.

The java code used in this example is taken from FocusManageBean.java.

In this example the ice:inputText is bound to an HtmlInputText instance named westText in the application backing bean.

page markup:

    < ice:inputText value="West"
        binding="#{focusBean.westText}"
    />

java code:

    import com.icesoft.faces.component.ext.HtmlInputText;

    private HtmlInputText westText = null;

    public HtmlInputText getWestText() {
        return westText;
    }


    public void setWestText(HtmlInputText westText) {
        this.westText = westText;
    }

In the following example code the requestFocus calls are made in a valueChangeListener which is also implemented in the applications backing bean.

page markup:

    < ice:selectOneRadio
           value="#{focusBean.selectedText}"
           styleClass="selectOneMenu"
           valueChangeListener="#{focusBean.selectedTextChanged}"
           partialSubmit="true" >
        < f:selectItem itemValue="#{focusBean.NORTH}"   itemLabel="North" />
        < f:selectItem itemValue="#{focusBean.WEST}"   itemLabel="West" />
        < f:selectItem itemValue="#{focusBean.CENTER}"   itemLabel="Center" />
        < f:selectItem itemValue="#{focusBean.EAST}"   itemLabel="East" />
        < f:selectItem itemValue="#{focusBean.SOUTH}"   itemLabel="South" />
    </ ice:selectOneRadio >

java code:

    public void selectedTextChanged(ValueChangeEvent event) {
        selectedText = event.getNewValue().toString();

        if (selectedText.equalsIgnoreCase(NORTH)) {
            this.northText.requestFocus();
        } else if (selectedText.equalsIgnoreCase(WEST)){
            this.westText.requestFocus();
        } else if (selectedText.equalsIgnoreCase(CENTER)) {
            this.centerText.requestFocus();
        } else if (selectedText.equalsIgnoreCase(EAST)){
            this.eastText.requestFocus();
        } else if (selectedText.equalsIgnoreCase(SOUTH)) {
            this.southText.requestFocus();
        }

    }

Download the demo:

Examples Using Focus Management

Example Source Notes
focusManage-basic focusManage-basic source code Simple example of how to use the ICEfaces component focus API in a backing bean.

The ICEfaces Tutorial
Table of Contents

Copyright 2006 ICEsoft Technologies Inc. All rights reserved.