<td align=”center”>
<input type=”text” readonly id=”binary”>
</td>
<td align=”center”>
<input type=”text” readonly id=”octal”>
</td>
<td align=”center”>
<input type=”text” readonly id=”decimal”>
</td>
<td align=”center”>
<input type=”text” readonly id=”hexadecimal”>
</td>
</tr>
</table>
</body>
</html>

The above html page has input text field of id “number” with “onkeyup” attribute that is set to the JavaScript function “convert ()”. This method is called each time the user release the key up.

“convert ()” first tries to get HTTP request object maintaining the browser compatibility. In this example, this object is stored in the variable named “xmlHttp”.Read how to get HTTP request object on page 12

Next step is to determine which method should be invoked after getting the response from the server. In this example, the method “handleResponse ()” is assigned for this purpose. Now the request for servlet “AjaxNumberConverterServlet” is forwarded to the server along with number as parameter.

AjaxNumberConverterServlet.java

import javax.servlet.*;
import javax.servlet.http.*;
import java.io.IOException;

public class AjaxNumberConverterServlet extends HttpServlet {
public void doGet( HttpServletRequest request, HttpServletResponse response ) throws
ServletException, IOException {
String strEnteredKey = request.getParameter(“number”);
StringBuffer responseXML = null;
if( strEnteredKey!=”” ){
int num = Integer.parseInt(strEnteredKey);
responseXML = new StringBuffer(“\r\n<converted-values>”);
responseXML.append(“\r\n<binary>”+Integer.toBinaryString(num)+”</binary>”);
responseXML.append(“\r\n<octal>”+Integer.toString(num,8)+”</octal>”);
responseXML.append(“\r\n<decimal>”+num+”</decimal>”);
responseXML.append(“\r\n<hexadecimal>”+Integer.toString(num,16)+”</hexadecimal>”);