Handsontable example

by winstonchang

HTML

<h2>Live updating of handsontable</h2>

<div id="example1" class="handsontable"></div>

CSS

</style><!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> <script src="http://handsontable.com/lib/jquery.min.js"></script> <script src="http://handsontable.com/dist/jquery.handsontable.full.js"></script> <script src="http://handsontable.com/lib/numeral.de-de.js"></script> <link rel="stylesheet" media="screen" href="http://handsontable.com/dist/jquery.handsontable.full.css"> <link rel="stylesheet" media="screen" href="http://handsontable.com/demo/css/samples.css"> <style type="text/css"> body {
    background: white;
    margin: 20px;
}
h2 {
    margin: 20px 0;
}

JavaScript

$(document).ready(function () {

    function getCarData() {
        return [
        ["Mercedes", "A 160", 2006, 6999.9999], ["Citroen", "C4 Coupe", 2008, 8330], ["Audi", "A4 Avant", 2011, 33900], ["BMW", "320i Coupe", 2011, 30500]];
    }

    $("#example1").handsontable({
        colHeaders: true,
        rowHeaders: true
    });

    var ht = $('#example1').handsontable('getInstance');
    // ht.setDataAtCell(0, 0, 'new value');
    ht.loadData(getCarData());

    $("#example1").handsontable({
        colHeaders: ['x', 'y', 'z', 'z1']
    });


});