slickgrid - Can't get minimal example working

H*wdy all,

I'm trying to SlickGrid working, by following the getting started instructions.

But my grid is not editable. Nothing happens when I click on a cell.

Here is my HTML/JS. I verified that all of the src's are being found.

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">

        <title></title>

        <link rel="stylesheet" href="css/smoothness/jquery-ui-1.8.16.custom.css" type="text/css" media="screen" charset="utf-8" />
        <link rel="stylesheet" href="slick.grid.css" type="text/css" media="screen" charset="utf-8" />

        <style>

        </style>

        <script src="lib/firebugx.js"></script>

        <script src="lib/jquery-1.7.min.js"></script>
        <script src="lib/jquery-ui-1.8.16.custom.min.js"></script>
        <script src="lib/jquery.event.drag-2.0.min.js"></script>

        <script src="slick.core.js"></script>
        <script src="plugins/slick.cellrangedecorator.js"></script>
        <script src="plugins/slick.cellrangeselector.js"></script>
        <script src="plugins/slick.cellselectionmodel.js"></script>
        <script src="slick.editors.js"></script>
        <script src="slick.grid.js"></script>


        <script type="text/javascript">
var rows = [
    {
        field_1: 2,
        field_2: "value2",
        id: 1
    }, {
        field_1: 3,
        field_2: "value4",
        id: 2
    }
];

var columns = [
    {
        name: "Address",
        field: "field_1",
        id: "field_1", 
    }, 
    {
        name: "Rating",
        field: "field_2",
        id: "field_2",
    }, 
];

var options = {
    enableCellNavigation: true,
    editable: true,
    asyncEditorLoading: false,
    autoEdit: false,
};

$(document).ready(function(){

    //See https://github.com/mleibman/SlickGrid/wiki/Getting-Started
    //for information on setting up SlickGrid.
    var slickgrid = new Slick.Grid("#platewell_grid", rows, columns, options);
    $('#platewell_grid').show();
    slickgrid.setSelectionModel(new Slick.CellSelectionModel());    
    slickgrid.updateRowCount();
    slickgrid.render();
});
        </script>

    </head>
    <body>
        <div style="width:600px;">
            <div id="platewell_grid" style="width:100%;height:500px;"></div>
        </div>    
    </body>
</html>

Solution

You grid is not editable because you have not specified any editors in the column definitions.