javascript-learning/tabletop-simple.html at master · CooperUnion/javascript-learning · 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
<!DOCTYPE html>
<html>
	<head>
		<title>Google Spreadsheet JSON Example</title>
		<script src="http://code.jquery.com/jquery-latest.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/tabletop.js/1.3.5/tabletop.min.js"></script>
		<script>
			$(document).ready(function(){

					//configure spreadsheet
				  var public_spreadsheet_url = '1Jw1eUNcqxmnyzEW8KZgISD-yDSN7IYCnDHKMwx2AtJY';

					//function to get data from the spreadsheet
				  var getData = function () {
				    Tabletop.init({
				    	"key": public_spreadsheet_url,
			        "callback": processData,
			        "simpleSheet": true
				    });
				  }

					//editable function that processes data from the spreadsheet
					var processData = function(data){
						console.log(data);
						for(var i=0; i<data.length; i++) {

							$("body").append(data[i].animal + " ");

						}
					};


					//function that runs when the page is ready
				  getData();

			});
		</script>
		<style>

		</style>

	</head>
	<body>
	</body>
</html>