jQuery EasyUI datagrid 无法选中多行

数据表格组件包含两个方法来获取选中行的数据:

• getSelected: 获取第一个选中行的数据，如果没有选中的行则返回空，否则返回该行的记录
• getSelections: 获取所有选中行的数据，返回数组，其元素为行的记录

创建标签

<table id="tt"></table>

创建数据表格

$('#tt').datagrid({
    title:'Load Data',
    iconCls:'icon-save',
    width:600,
    height:250,
    url:'datagrid_data.json',
    columns:[[
        {field:'itemid',title:'Item ID',width:80},
        {field:'productid',title:'Product ID',width:80},
        {field:'listprice',title:'List Price',width:80,align:'right'},
        {field:'unitcost',title:'Unit Cost',width:80,align:'right'},
        {field:'attr1',title:'Attribute',width:100},
        {field:'status',title:'Status',width:60}
    ]]
});

用法实例

获取选中行的数据:

var row = $('#tt').datagrid('getSelected');
if (row){
    alert('Item ID:'+row.itemid+"\nPrice:"+row.listprice);
}

获取所有选中行的项id:

var ids = [];
var rows = $('#tt').datagrid('getSelections');
for(var i=0; i<rows.length; i++){
    ids.push(rows[i].itemid);
}
alert(ids.join('\n'));

但是，使用却无法获取所有选中行的项id，原因是：datagrid 中的 idField 属性，必须对应后台的实体属性字段，而且该字段必须确保唯一性，一般用id标识，否则就无法获取在datagrid中选择的多条记录。

所以，应该这样写：

$('#tt').datagrid({
    title:'Load Data',
    iconCls:'icon-save',
    width:600,
    height:250,

    isField: 'itemid',
    url:'datagrid_data.json',
    columns:[[
        {field:'itemid',title:'Item ID',width:80},
        {field:'productid',title:'Product ID',width:80},
        {field:'listprice',title:'List Price',width:80,align:'right'},
        {field:'unitcost',title:'Unit Cost',width:80,align:'right'},
        {field:'attr1',title:'Attribute',width:100},
        {field:'status',title:'Status',width:60}
    ]]
});