本实例演示如何取得选中行数据。

EasyUI 取得选中行数据_数组

数据网格(datagrid)组件包含两种方法来检索选中行数据:

  • getSelected:取得第一个选中行数据,如果没有选中行,则返回 null,否则返回记录。
  • getSelections:取得所有选中行数据,返回元素记录的数组数据。

创建数据网格(DataGrid)

  1. <table id="tt" class="easyui-datagrid" style="width:600px;height:250px"
  2. url="data/datagrid_data.json"
  3. title="Load Data"iconCls="icon-save">
  4. <thead>
  5. <tr>
  6. <thfield="itemid"width="80">Item ID</th>
  7. <thfield="productid"width="80">Product ID</th>
  8. <thfield="listprice"width="80"align="right">List Price</th>
  9. <thfield="unitcost"width="80"align="right">Unit Cost</th>
  10. <thfield="attr1"width="150">Attribute</th>
  11. <thfield="status"width="60"align="center">Stauts</th>
  12. </tr>
  13. </thead>
  14. </table>

使用演示

取得选中行数据:

  1. var row = $('#tt').datagrid('getSelected');
  2. if (row){
  3. alert('Item ID:'+row.itemid+"
  4. Price:"+row.listprice);
  5. }

取得所有选中行的 itemid:

  1. var ids = [];
  2. var rows = $('#tt').datagrid('getSelections');
  3. for(var i=0; i<rows.length; i++){
  4. ids.push(rows[i].itemid);
  5. }
  6. alert(ids.join('
  7. '));