Question

我使用ajax调用在slickgrid中显示一些数据，看起来像这样。

india 564

usa 45454

japan 5454

在我提取的数据表中，没有名为'Number'的列具有行号值。如何设置名为“Number”的列并设置值？我想要的是类似的东西。

1 india 564

2 usa 45454

3 japan 5454

Answer 1

要显示行号，您不需要特定的字段/属性。您可以定义一个列并指定formatter column option以根据函数作为第一个参数接收的网格的基础索引返回一个值。由于网格基于0索引，因此进行相应调整。

var grid;
var dataView = new Slick.Data.DataView();
var data = [{country: "usa", number: "123"},
    {country: "japan", number: "456"},
    {country: "india", number: "789"}];
    
var options = {
    editable: false,
    enableCellNavigation: true
};
var columns = [{name: "Row No", formatter: function(row){return row+1}},
    {field: "country", name: "Country"},
    {field: "number", name: "Data"}];

dataView.setItems(data, 'country')
grid = new Slick.Grid("#myGrid", dataView, columns, options);

<link rel="stylesheet" type="text/css" href="http://mleibman.github.io/SlickGrid/slick.grid.css">
<link rel="stylesheet" href="http://mleibman.github.io/SlickGrid/examples/examples.css" type="text/css"/>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.min.js"></script>

<script src="http://mleibman.github.io/SlickGrid/lib/jquery.event.drag-2.2.js"></script>
<script src="http://mleibman.github.io/SlickGrid/slick.core.js"></script>
<script src="http://mleibman.github.io/SlickGrid/slick.grid.js"></script>
<script src="http://mleibman.github.io/SlickGrid/slick.dataview.js"></script>    
    
<div id="myGrid" style="width:300px;height:150px;"></div>

如何在slickgrid中显示行号列？

1 个答案: