cal.html

<!DOCTYPE html>
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script>
        function setDefaultDate(){
            document.getElementById('cal').valueAsDate = new Date();
        }
        function onLoad() {
            setDefaultDate();
        }
        function callAwsLambdaFunction() {
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function() {
                if (xhr.readyState == XMLHttpRequest.DONE) {
                    document.getElementById("myDiv").innerHTML=xhr.responseText.replaceAll('**', '<br />');
                }
            }
            xhr.open("POST", 'https://l1qlcbpoq9.execute-api.us-west-1.amazonaws.com/default/trialCal', true);
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            var date = document.getElementById("cal").value + ' 00:00:00';
            var loca = document.getElementById("loca").value;
            xhr.send('date='+date+'&loca='+loca);
            console.log(xhr);
        }
    </script>   
    <title>Trial Cal</title>
</head>
    <body onload="onLoad()">
        <h1>Trial Calander</h1>
        <label>Trial Date:</label>
        <input type="date" id="cal"></input>
        <forn>
        <label>County:</label>
        <select id="loca">
            <option value="CCC">CCC</option>
        </select>
        <br>
        <button onclick="callAwsLambdaFunction()">Create Cal</button><br />
        <p><div id="myDiv">Enter Date and Court to see Calander</div></p><dr />
    </body>
</html>