A simple tag <f:ajax> does the trick.
The main point to be noted is the change in the JSF view 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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html" >
<h:body>
<f:view>
<h:form id="form1">
<h:inputText id="text1" value="#{backing.name}" /><br/>
<h:commandButton id="button1" value="echo">
<f:ajax execute="text1" render="text2"/>
</h:commandButton>
<h:outputText id="text2" value="#{backing.result}" />
</h:form>
</f:view>
</h:body>
</html>
***********************************************
The model is as usual
package mypack;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.event.*;
@ManagedBean(name="backing")
@SessionScoped
public class backing implements Serializable
{
String name=null;
String result;
public void setName(String a){ name=a; }
public void setResult(String a){result=a;}
public String getName(){return name;}
public String getResult()
{
echobean bean1=new echobean();
result = bean1.echothis(name);
return result;
}
//------------------------------------------
}
****************************************
The helper class echobean is given below
package mypack;
public class echobean
{
public String echothis(String a)
{
return "echo is "+ a;
}
}
***************************************
Explanation for the JSF code.
Carefully note that <f:ajax> tag occurs inside command button tags.
<h:commandButton id="button1" value="echo">
<f:ajax execute="text1" render="text2"/>
</h:commandButton>
Screen shots follow
BEFORE AJAX CALL
AFTER AJAX CALL