slickgrid - 无法获得最小的工作示例

时间:2011-11-22 20:00:39

标签: slickgrid

H * wdy all,

我正在尝试通过关注getting started instructions来运行SlickGrid。

但我的网格不可编辑。单击一个单元格时没有任何反应。

这是我的HTML / JS。我确认找到了所有的src。

<!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>

1 个答案:

答案 0 :(得分:9)

您的网格不可编辑,因为您未在列定义中指定任何编辑器。