Internationalization (i18n) is easy if you are using AJAX and Java. Both Java and JavaScript have i18n capabilities though it is not obvious how to use those capabilities are not from an i18n background.

I have re-worked the Realtime Validation with AJAX example to be i18n enabled. Follow these steps on the client and server to support i18n.

On the client:

• Set the content-type in your pages to UTF-8

  UTF-8 is the recommended encoding as it supports the widest range of languages.

• From JavaScript call encodeURIComponent() on localized form parameters.

  This is a built in JavaScript function that will make sure form variables are encoded in an HTTP friendly way. The encoding scheme used matches the charset used in the content-type of the page.

The following JavaScript snippet gathers form information to send back to the server in an AJAX request. Note the sections marked in red.

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<script type="text/javascript">
...
function validateUserId() {
    if (!target) target = document.getElementById("userid");
    var url = "validate?id=" + encodeURIComponent(target.value);    
    var target = document.getElementById("userid");
    var ajax = new AJAXInteraction(url, validationCallback);
    ajax.doGet();
}

function validateCallback(responseXML) {
   var msg = responseXML.getElementsByTagName("valid")[0].firstChild.nodeValue;
   if (msg == "false"){
       var mdiv = document.getElementById("userIdMessage");
       // set the style on the div to invalid
       mdiv.className = "bp_invalid";
       mdiv.innerHTML = "Invalid User Id";
       var submitBtn = document.getElementById("submit_btn");
       submitBtn.disabled = true;
    } else {
       var mdiv = document.getElementById("userIdMessage");
       // set the style on the div to valid
       mdiv.className = "bp_valid";
       mdiv.innerHTML = "Valid User Id";
       var submitBtn = document.getElementById("submit_btn");
       submitBtn.disabled = false;
    }  
}
</script>
...
 <input    type="text"
                size="20"  
                  id="userid"
		name="id"
                autocomplete="off"
             onkeyup="validateUserId()">

<div id="userIdMessage"></div>

On the server:

• Call request.setCharacterEncoding("UTF-8") before getting any parameters.

  We know this is the correct encoding because we set it as the content type of the page.

• Set the content-type on the response to "UTF-8" if it contains localized content.

  Event though the defualt encoding of XML is UTF-8 don't assume the conent will be encoded in UTF-8. Set the response content type using the servlet method response.setContentType where the content-type is followed by the encoding used for the response. In this case use "charset=UTF-8".

The following servlet interacts with an internationalized AJAX client. Once again the i18n specific portions are marked in red.

public class ValidationServlet extends HttpServlet {
    
    private ServletContext context;
    private HashMap accounts = new HashMap();
 
    public void init(ServletConfig config) throws ServletException {
        super.init(config);
        this.context = config.getServletContext();
        accounts.put("greg","account data");
        accounts.put("duke","account data");
        // add a Japanese hiragana example "ne" "ko" (cat)
        accounts.put("\u306D\u3053","account data");
    }
    
    public  void doGet(HttpServletRequest request, HttpServletResponse  response)
        throws IOException, ServletException {
        request.setCharacterEncoding("UTF-8");
        String targetId = request.getParameter("id");
	    if ((targetId != null) && !accounts.containsKey(targetId.trim())) {
            response.setContentType("text/xml;charset=UTF-8");
            response.setHeader("Cache-Control", "no-cache");
            response.getWriter().write("<valid>true</valid>");
        } else {
            response.setContentType("text/xml");
            response.setHeader("Cache-Control", "no-cache");
            response.getWriter().write("<valid>false</valid>");
        }
    }
}

That is pretty much it. This example the Japanese hiragana characters "ねこ" are a reserved user id. The image below shows the example running.

Find the code and more about this example at Realtime Validation with AJAX.