<!--

ajax3.html

Gets stock quote from quote1.php via Ajax, embedding result in page itself.

David J. Malan
Computer Science S-75
Harvard Summer School

-->

<!DOCTYPE html>

<html>
  <head>
    <script>

        // an XMLHttpRequest
        var xhr = null;

        /*
         * void
         * quote()
         *
         * Gets a quote.
         */
        function quote()
        {
            // instantiate XMLHttpRequest object
            try
            {
                xhr = new XMLHttpRequest();
            }
            catch (e)
            {
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }

            // handle old browsers
            if (xhr == null)
            {
                alert("Ajax not supported by your browser!");
                return;
            }

            // construct URL
            var url = "quote1.php?symbol=" + document.getElementById("symbol").value;

            // get quote
            xhr.onreadystatechange = handler;
            xhr.open("GET", url, true);
            xhr.send(null);
        }


        /*
         * void
         * handler()
         *
         * Handles the Ajax response.
         */
        function handler()
        {
            // only handle loaded requests
            if (xhr.readyState == 4)
            {
                if (xhr.status == 200)
                    document.getElementById("price").innerHTML = xhr.responseText;
                else
                    alert("Error with Ajax call!");
            }
        }

    </script>
    <title></title>
  </head>
  <body>
    <form onsubmit="quote(); return false;">
      Symbol: <input id="symbol" type="text">
      <br>
      Price: <span id="price"><b>to be determined</b></span>
      <br><br>
      <input type="submit" value="Get Quote">
    </form>
  </body>
</html>