Handsontable Tests

HTML

<script src="http://handsontable.com/dist/jquery.handsontable.full.js"></script>
<link rel="stylesheet" href="http://handsontable.com/dist/jquery.handsontable.full.css">
<link rel="stylesheet" href="http://handsontable.com/demo/css/samples.css">
<h2>Testing Edit Row Buttons</h2>

<p>Add rows on top</p>
<p>
    <button name="add" id="addtop" title="adds row to top of table">Add</button>
    <button name="delete" class="deletebutton" title="deletes selected rows">Delete</button>
</p>
<div id="exampleGrid" class="dataTable"></div>
<p>
    <button name="add" id="addbottom" title="adds row to bottom of table">Add</button>
    <button name="delete" class="deletebutton" title="deletes selected rows">Delete</button>
</p>
<p>Add rows at the bottom
    </p

CSS

body {
    background-color: white;
    margin: 20px;
}
h2 {
    margin: 20px 0;
}
.handsontable .currentRow {
    background-color: #F98819;
}
.handsontable .currentCol {
    background-color: #FCD64D;
}

JavaScript

$(document).ready(function () {

    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,
        currentRowClassName: 'currentRow',
        currentColClassName: 'currentCol'

    });
	
	$edit = $('#exampleGrid');

    function editRows() {

        $('#addtop').on('click', function () {
            $edit.handsontable('alter', 'insert_row', 0);
        });

        $('#addbottom').on('click', function () {
            $edit.handsontable('alter', 'insert_row');
        });

        var selection = $edit.handsontable('getSelected');
        $('.deletebutton').on('click', function () {
            $edit.handsontable('alter', 'remove_row', selection[0], selection[2]);
        });


    }

    editRows();

});