Bootstrap Skeleton
This is a simple Bootstrap skeleton. You can fork it to get a ready to use Bootstrap fiddle.
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>
<script src="http://handsontable.com/jquery.handsontable.js"></script>
<link rel="stylesheet" href="http://handsontable.com/jquery.handsontable.css">
<input class="input-xlarge" id="disabledInput" type="text" placeholder="Disabled input here..." disabled>
<h2>Default Handsontable Demo</h2>
<div id="exampleGrid" class="dataTable"></div>
CSS
@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
.container {
margin-top: 10px;
}
JavaScript
var myData = [
["", "Kia", "Nissan", "Toyota", "Honda"],
["2008", 10, 11, 12, 13],
["2009", 20, 11, 14, 13],
["2010", 30, 15, 12, 13]
];
$("#exampleGrid").handsontable({
data: myData,
startRows: 5,
startCols: 5,
minSpareCols: 1,
//always keep at least 1 spare row at the right
minSpareRows: 1,
//always keep at least 1 spare row at the bottom,
rowHeaders: true,
colHeaders: true,
contextMenu: true,
cells: function (row, col) {
var cellProperties = {};
cellProperties.readOnly = true;
return cellProperties;
}
});