The following example gives an idea of the capabilities of eArea. Press See Contents to see the HTML code behind the contents of the text box. This shows the results of a call to editableAreaContents (see below). Pressing Post Contents will submit a form containing the contents of the eArea to a second page via the HTTP post method.
eAreas use very flexible code. The code consists of two parts: first the main eArea JavaScript file (5.7 kilobytes) needs to be linked to then the eArea is inserted onto a page. The main JavaScript file is linked to in the usual way:
<script language="javascript" type="text/javascript"
src="eArea/editableArea.js"></script>
Once the main JavaScript file has been linked to, an eArea can be written onto the page using the document.write method by invoking the insertEditableArea function. The following syntax would reproduce an eArea similar to the one above:
<script language="javascript">
insertEditableArea(
"myEditArea", // the name of this editable area
300, // the width of the editable area
200, // the height of the editable area
// the following string defines the where UI elements appear
"[bold][italic][underlined][align-left][justify][align-center]
[align-right]<br />[edit-area]",
// finally, the CSS style of of the default text
"font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px; color:Black;"
);
</script>
To retrieve the contents of the above eArea, the following function in JavaScript:
editableAreaContents("myEditArea")