sjat-ex1

<!DOCTYPE html>
<html  xmlns="http://www.w3.org/1999/xhtml">

<!--
    example attempting synchronous javascript and plain text
    (sjat? 8-) )

    adapted from example in Chapter 12 of "Web Programming Step by
    Step", 2nd edition, p. 445

    by: Sharon Tuttle
    last modified: 2016-04-27
-->

<head>
    <title> "Sjat" example 1 </title>
    <meta charset="utf-8" />

    <link href="http://users.humboldt.edu/smtuttle/styles/normalize.css" 
          type="text/css" rel="stylesheet" />

    <script type="text/javascript">

        // when button w/ id = "load" is clicked,
        //     hope to synchronously fill a textarea

        window.onload =
            function()
            {
                var loadButton = document.getElementById("load");
                loadButton.onclick = loadClick;
            };

        // signature: function: loadClick: void -> void
        // purpose: expects nothing, and returns nothing,
        //     but hopefully has the side-effect of filling
        //     a textarea with id = "output" with the contents
        //     of local file notes.txt

        function loadClick()
        {
            var ajaxReq = new XMLHttpRequest();
            ajaxReq.open("GET", "notes.txt", false);
            ajaxReq.send(null);

            // when request is completed
            
            var outputTextArea = document.getElementById("output");
            outputTextArea.value = ajaxReq.responseText;
        }
    </script>

</head>

<body>

   <p> <strong> [warning: this page will not behave as it should if
       JavaScript is disabled] </strong> 
   </p>

    <h1> "Sjat" example 1 </h1>

    <!-- it feels weird not having a form here - shouldn't for this
         particular little example, right?? -->

    <p>
        <textarea name="notes" rows="5" cols="20" id="output">
        </textarea>
    </p>

    <p>
    <button id="load"> Load </button>
    </p>

<?php
    require_once("328footer-better.html");
?>