t1089 · March 26, 2020 13:33
diff --git a/index.html b/index.html
 <h1>Table</h1>
 <div class="container">
  <table id="results" class="table table-striped">
    <!-- dynamic table json -->
  </table>
 </div>
diff --git a/json-table.markdown b/json-table.markdown
diff --git a/script.js b/script.js
 $.ajax({
  url: "https://health.data.ny.gov/resource/h5s5-hcxg.json",
  //force to handle it as text
  dataType: "text",
  success: function(data) {

    //data downloaded so we call parseJSON function 
    //and pass downloaded data
    var json = $.parseJSON(data);
    //now json variable contains data in json format
    //let's display a few items

    // we'll put all our html in here for now
    var html = '';
    for (var i=0;i<json.length;++i)
    {
      // if on first loop, create the col headers
      if(i===0){
        html += '<thead class="bg-warning lead text-center"><tr>';
        $.each(json[i], function(key, value){
            html += '<td>'+key+'</td>' ;
          });
        html += '</tr></thead>';
      }

      // loop through all the json objects and for every key add a column with the value
        html += '<tr>';
        $.each(json[i], function(key, value){
          html += '<td>'+value+'</td>' ;
        });
      html += '</tr>';
    }
    // push all the html in one go to the page
    $('#results').append(html);
  }
 });
diff --git a/scripts b/scripts
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
diff --git a/styles b/styles
 <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta/css/bootstrap.min.css" rel="stylesheet" />
	<h1>Table</h1>
	<div class="container">
	<table id="results" class="table table-striped">
	<!-- dynamic table json -->
	</table>
	</div>
	$.ajax({
	url: "https://health.data.ny.gov/resource/h5s5-hcxg.json",
	//force to handle it as text
	dataType: "text",
	success: function(data) {

	//data downloaded so we call parseJSON function
	//and pass downloaded data
	var json = $.parseJSON(data);
	//now json variable contains data in json format
	//let's display a few items

	// we'll put all our html in here for now
	var html = '';
	for (var i=0;i<json.length;++i)
	{
	// if on first loop, create the col headers
	if(i===0){
	html += '<thead class="bg-warning lead text-center"><tr>';
	$.each(json[i], function(key, value){
	html += '<td>'+key+'</td>' ;
	});
	html += '</tr></thead>';
	}

	// loop through all the json objects and for every key add a column with the value
	html += '<tr>';
	$.each(json[i], function(key, value){
	html += '<td>'+value+'</td>' ;
	});
	html += '</tr>';
	}
	// push all the html in one go to the page
	$('#results').append(html);
	}
	});