CISC4667-Web-Tips/index.html at main · mattm401/CISC4667-Web-Tips · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
	<script src="http://d3js.org/d3.v4.min.js"></script>
</head>
<body>
<p>Hello, World!</p>
<hr />
<h3>State:</h3>
<pre id="json"></pre>
<hr />
<h3>Add Record:</h3>
<input type="hidden" id="message" value="This is a test from the form"/>
<button type="submit" id="button" value="Submit">Add Record</button>

<script type="text/javascript">
    $("#button").click(function(e) {
        e.preventDefault();
        $.ajax({
          type: "POST",
          url: "/",
          data: JSON.stringify({
            message: $("#message").val(),
          }),
          success: [function() {
            alert('Record Inserted');
          }],
          error: [function() {
            alert('Error Returned');
          }]
        });
    });

	function GetStatus()
	{
    	$(function() {

			 $.ajax({
				type: 'GET',
				url: '/api/v1/status/',
				success: [
				    function (data) {
                        let message = data['message'];
                        document.getElementById("json").innerHTML = "<br />API Status: " + message + "";
				    }
				]
			 });
		})
	}

	$(document).ready(function() {
		GetStatus();
		setInterval( GetStatus, 8000 );
	});

</script>
</body>
</html>