Created
September 28, 2018 23:10
-
-
Save SergiyIlchyshyn/76fc87de0752ec89c5c08d4b46e09e08 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> | |
| <script type="text/javascript"> | |
| var spData = null; | |
| function doData(json) { | |
| spData = json.feed.entry; | |
| } | |
| function drawCell(tr, val) { | |
| var td = $("<td/>"); | |
| tr.append(td); | |
| td.append(val); | |
| return td; | |
| } | |
| function drawRow(table, rowData) { | |
| if (rowData == null) return null; | |
| if (rowData.length == 0) return null; | |
| var tr = $("<tr/>"); | |
| table.append(tr); | |
| for(var c=0; c<rowData.length; c++) { | |
| drawCell(tr, rowData[c]); | |
| } | |
| return tr; | |
| } | |
| function drawTable(parent) { | |
| var table = $("<table/>"); | |
| parent.append(table); | |
| return table; | |
| } | |
| function readData(parent) { | |
| var data = spData; | |
| var table = drawTable(parent); | |
| var rowData = []; | |
| for(var r=0; r<data.length; r++) { | |
| var cell = data[r]["gs$cell"]; | |
| var val = cell["$t"]; | |
| if (cell.col == 1) { | |
| drawRow(table, rowData); | |
| rowData = []; | |
| } | |
| rowData.push(val); | |
| } | |
| drawRow(table, rowData); | |
| } | |
| $(document).ready(function(){ | |
| readData($("#data")); | |
| }); | |
| </script> | |
| <script src="https://spreadsheets.google.com/feeds/cells/1hbHqrnYa4oMUquZcq8WkTJk0kI0t9scGBwro-EH-ALA/1/public/values?alt=json-in-script&callback=doData"></script> | |
| <style type="text/css"> | |
| table {border-collapse: collapse; width: 100%;} | |
| th, td {border: thin solid black; padding: 3px;} | |
| tr.head th, tr.head td {background-color: #EDEDED; border-bottom: 4px double black;} | |
| span.linetitle {font-weight: bold;} | |
| div.lineclass {font-style: italic;} | |
| .title, .result {width: 80%;} | |
| .notes {width: 15%;} | |
| h1 {text-align: center;} | |
| body {margin: 12px; font-size: 12px;} | |
| </style> | |
| <style type="text/css" media="print"> | |
| form {display: none;} | |
| </style> | |
| </head> | |
| <body> | |
| <h1>Parse Google Spreadsheet with JavaScript</h1> | |
| <div id="data"/> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment