Handsontable example

HTML

<font size="11" face="Ubuntu">
<form method="POST" action="/spreadsheet.php?spreadsheet=26&amp;class=class5c65cab8a7404" onsubmit="getTableData()">	<input id="tableData" name="tableData" type="text" style="display: none;">
	
	<div id="container" style="width: 100%; font-family: 'Ubuntu'" data-initialstyle="width: 100%; font-family: 'Ubuntu'" data-originalstyle="width: 100%; font-family: 'Ubuntu'" class="handsontable"><div class="ht_master handsontable" style="position: relative; overflow: visible;"><div class="wtHolder" style="position: relative; overflow: visible;"><div class="wtHider" style="width: 400px; height: 116px;"><div class="wtSpreader" style="position: relative; top: 0px; left: 0px;"><table class="htCore"><colgroup><col style="width: 80px;"><col style="width: 80px;"><col style="width: 80px;"><col style="width: 80px;"><col style="width: 80px;"></colgroup><thead></thead><tbody><tr><td class=""></td><td class=""></td><td class=""></td><td class=""></td><td class=""></td></tr><tr><td class=""></td><td class="current highlight"></td><td class=""></td><td class=""></td><td class=""></td></tr><tr><td class=""></td><td class=""></td><td class=""></td><td class=""></td><td class=""></td></tr><tr><td class=""></td><td class=""></td><td class=""></td><td class=""></td><td class=""></td></tr><tr><td class=""></td><td class=""></td><td class=""></td><td class=""></td><td class=""></td></tr></tbody></table><div class="htBorders"><div style="position: absolute; top: 0px; left: 0px;"><div class="wtBorder current" style="background-color: rgb(75, 137, 255); height: 2px; width: 80px; display: block; top: 21px; left: 79px;"></div><div class="wtBorder current" style="background-color: rgb(75, 137, 255); height: 22px; width: 2px; display: block; top: 21px; left: 79px;"></div><div class="wtBorder current" style="background-color: rgb(75, 137, 255); height: 2px; width: 80px; display: block; top: 42px; left: 79px;"></div><div class="wtBorder current" style="background-color:...

CSS

</style><!-- Ugly Hack due to jsFiddle issue -->

<script src="https://cdn.jsdelivr.net/npm/handsontable@7.0.0/dist/handsontable.full.min.js"></script>
<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/handsontable@7.0.0/dist/handsontable.full.min.css">

JavaScript

var data = Handsontable.helper.createSpreadsheetData(10,10);
var rowHeaders = true;
var columnHeaders = true;

var container = document.getElementById('container');
	var hot = new Handsontable(container, {
  		data: data,
  		rowHeaders: rowHeaders,
  		colHeaders: columnHeaders,
  		manualColumnResize: true,
  		manualRowResize: true,
	});	
	
	function getTableData(){
		var input = document.getElementById('tableData');
		var data = hot.getData();
		input.value = data;
	}