Unicode Explained

Buttons for Character Input

In

“Virtual Keyboards” in Chapter 2, we discussed the idea of buttons for entering

characters in a data entry form. To implement it in an HTML form, you would use an

input element of type button and associate an onclick event with it. The event handler

would append a character to the content of an input box and focus on that box, so that

the user can continue typing with the normal keyboard. The interface is illustrated in

Figure 11-1.

The idea can be implemented in JavaScript as follows. For simplicity, the example has

just two buttons, for entering ä and ö:

<form action="http://www.tracetech.net:8081/">

<div><label for="word">Finnish or English word:</label></div>

<div>

<input type="text" id="word" name="word" size="25" maxlength="80">

<input type="submit" value="Search">

</div>

<div>

<input type="button" value="ä" onclick="append('ä')">

<input type="button" value="ö" onclick="append('ö')">

</div>

</form>

<script type="text/javascript">

var word = document.getElementById('word');

function append(char) {

word.value += char;

word.focus(); }

</script>

Processing Form Data

The form concept in HTML is rather simple, even simplistic. This has been obscured

by the superficial complexity of elements used to construct a form as well as by the

variation in technologies for processing form data. The basic idea is the following:

• A form element in HTML defines a data structure for ...