easyui的datagrid自定义一列,并在每行显示数据的数量
时间: 2024-02-16 17:02:53 浏览: 84
easyui 自定义显示列
3星 · 编辑精心推荐
可以通过easyui的datagrid的columns属性中添加一个自定义列来实现自定义列,使用formatter属性来格式化该列显示的内容。同时,在formatter中可以获取到每行的数据,可以根据每行的数据来计算并显示每行的数据数量。
示例代码如下:
```html
<table id="datagrid"></table>
<script>
$('#datagrid').datagrid({
url: 'data.json',
columns: [{
field: 'name',
title: '姓名',
width: 100
}, {
field: 'age',
title: '年龄',
width: 100
}, {
title: '数据数量',
formatter: function(value, row, index) {
// 这里可以根据row中的数据来计算每行的数据数量
var count = row.name.length + row.age.toString().length;
return '<div>' + count + '</div>';
}
}]
});
</script>
```
以上代码中,我们定义了一个datagrid,并指定了数据源的url,同时在columns属性中添加了3列,其中第3列是我们自定义的列,使用formatter属性来格式化该列的内容。在formatter中,我们可以根据row中的数据来计算每行的数据数量,并将其显示在该列中。
阅读全文