Mail page sample: a form submission

Many applications involve some sort of form submission. The mail page in this sample application, mail.html, submits a form. The page displays messages and allows the user to reply by tapping a Reply link. The Reply link displays the form. The workings of this page are described in detail in Mail page: a form submission.

The full source code for mail.html is listed below. For instructions on downloading this source code, see Downloading and accessing the JavaScript engine sample files.

<html>

<head>

<title>New Mail</title>

<meta name="HandheldFriendly" content="True">

<script language="JavaScript1.2">

<!--

// 
// FILE: mail.html 
// 
// Revision Date: March 15, 2002 
// 
// Copyright (c) 2006, iAnywhere Solutions, Inc. 
// 
//--> 
    <!-- 
    // 
    // FUNCTION: InitializeNav() 
    // 
    function InitializeNav() 
    {

        if (arguments.length != 0) 
            throw new Error("function InitializeNav() 
                incorrectly called");

        initializeDisp();

        // 
        // By default, the navigation bar is not displayed. 
        // 
        HideNav();

        // 
        // Show the navigation URLs that are at the bottom of the HTML 
        document. 
        // 
        document.getElementById("navurls").style.display = "block";

        return;

    } // InitializeNav

    // Purpose: Show the dropdown navigation bar. 
    // 
    function ShowNav() 
    {

        if (arguments.length != 0) 
            throw new Error("function ShowNav() 
                incorrectly called");

        document.getElementById('openNav').style.display="block"; 
        document.getElementById('closedNav').style.display="none"; 
        document.getElementById('nav').style.display="block";

        return;

    } // ShowNav

    // 
    // FUNCTION: HideNav() 
    // 
    // Purpose: Hide the dropdown navigation bar.
    // 
    function HideNav()
    {

        if (arguments.length != 0) 
            throw new Error("function HideNav() 
            incorrectly called");

        document.getElementById('openNav').style.display="none"; 
        document.getElementById('closedNav').style.display="block"; 
        document.getElementById('nav').style.display="none";

        return;

    } // HideNav

    // 
    // FUNCTION: InitializeDisp() 
    // 
    function InitializeDisp() 
    {

        var obj;

        if (arguments.length != 0) 
            throw new Error("function InitializeDisp() 
                incorrectly called");

        obj = document.getElementById("item1Text"); 
        if (obj) 
            obj.style.display = "none";

        obj = document.getElementById("item2Text"); 
            if (obj) 
            obj.style.display = "none";

        document.getElementById("navurls").style.display = "none"; 
        return;

    } // InitializeDisp

    // 
    // FUNCTION: ExpandDisp() 
    // 
    function ExpandDisp(id) 
    { 
        var style;

        if (arguments.length != 1) 
            throw new Error("function ExpandDisp() 
                incorrectly called");

        style = document.getElementById(id).style; 
        style.display = ((style.display == "none") ? "block" : "none" );

        return false;

    } // ExpandDisp 
//--> 
</script>

</head>

<body onload="InitializeNav();" 
    style="FONT-SIZE: 8px; COLOR: #000000; FONT-FAMILY: 
        verdana,geneva,arial; 
    MARGIN-TOP: 0px; MARGIN-LEFT: 0px">

<table border="0" width="144" style="font-size: 8px; COLOR: #000000;">

<tr> 
    <td valign="top" width="128"> 
    <IMG height=34 src="logo.gif" width=118 border=0> 
    <IMG height=5 src="darkdotline.gif" width=118 border=0>

    <span style="COLOR: #333333"> 
    NEW MAIL 
    </span> 
    <br> 
    <IMG height=5 src="darkdotline.gif" width=118 border=0> 
    <br>

    <span style="COLOR: #333333"> 
    <b>FROM:</b>Fred Jones, Boeing<br> 
    Did you mail me the driving instructions to your facility?<br> 
    <A onclick="return ExpandDisp('item2Text');" href ="#">Reply</A> 
    </span>

    <div class="dataElement" ID="item2Text"> 
    <form action="mailsent.html" id=form1 name=form1> 
    <TEXTAREA id=textarea style="FONT-SIZE: 8px; WIDTH: 106px; 
        HEIGHT: 86px" name=textarea rows=6 cols=17> 
    </TEXTAREA> 
    <br> 
    <input type=submit value=send id=submit1 name=submit1> 
    </form> 
    </div>

    <br>

    </td>

    <td valign="top" align="right" width="16"> 
    <div id="openNav" onclick="HideNav()"> 
    <IMG height=11 src="open.gif" width=16 border=0> 
    </div>

    <div id="closedNav" onclick="ShowNav()"> 
    <IMG height=11 src="closed.gif" width=16 border=0> 
    </div>

    <div id="nav"> 
    <IMG height=92 src="mail_nav.gif" width=16 useMap=#nav border=0> 
    </div>

    </td>

</tr>

</table>

<br>

<map name="nav"> 
<area shape="RECT" coords="0,0,15,15" href="index.html"> 
<area shape="RECT" coords="0,19,15,34" href="calendar.html"> 
<area shape="RECT" coords="0,38,15,53" href="chart.html"> 
<area shape="RECT" coords="0,57,15,72" href="mail.html"> 
<area shape="RECT" coords="0,76,15,91" href="leads.html"> 
</map>

<div ID="navurls"> 
<table border="0" width="120" 
    style="FONT-SIZE: 8px; PADDING-BOTTOM: 1px; PADDING-TOP: 1px; 
    FONT-FAMILY: verdana,geneva,arial">

<tr align="center" valign="top" > 
    <td><A href="index.html">Home</A></td> 
    <td><A href="calendar.html">Cal</A></td> 
    <td><A href="chart.html">Chart</A></td> 
    <td><A href="mail.html">Mail</A></td> 
    <td><A href="leads.html">Leads</A></td> 
</tr>

</table>

</div>

</body>

</html>

Send feedback about this page using email.