easy-ui的data-options用法

页面代码部分:

<thead> 
<tr> 
<th data-options="field:'a',width:60">停车时刻</th> 
<th data-options="field:'nMin',width:50">时长</th> 
<th data-options="field:'poi',width:80,">地点</th> 
</tr>
</thead>

在easy-ui里面,data-options可以轻松定义列表的属性,这里field:'a'声明一个数据名称,该数据名和api接口里一致;

在js中datagrid作为easy-ui的数据表格控件,可以通过idFiled属性获得页面的标识字段,从而对页面的数据进行操作。

对应的js 部分

//datagrid初始化
function datagrid_init() {
window.dg = $('#dg').datagrid({
idField: 'a',//识别页面的标识字段
header: '#hh',//表头id
singleSelect: true,//单行选择
border: false,//边框线
remoteSort: true,//定义从服务器对数据进行排序
pageSize: 10,//页码数
pagination: true,//分页
fit: true,
fitColumns: true,//自动列宽
scrollbarSize: 0,//滚动条的宽度
onDblClickRow: function (rowIndex, rowData) {//用户双击一行时触发 rowIndex:点击的行的索引值,该索引值从0开始。
//rowData:对应于点击行的记录。

//alert(rowData.lng);
var msg = "时间:" + rowData.a + "<br>里程:" + rowData.mileage + "<br>行驶时间:" + rowData.nMin;
refresh(rowData.lng, rowData.lat, msg, rowData.a)
$.mobile.go('#p3');
}

});
window.pg = $('#dg').datagrid('getPager');
$('.datagrid-pager').pagination({
onSelectPage: function (pageNumber, pageSize) {
$(this).pagination('loading');
//alert('pageNumber:' + pageNumber + ',pageSize:' + pageSize); 
qry_pos();
$(this).pagination('loaded');
}
});
}

 

posted @ 2017-03-06 14:36  missmz  阅读(55298)  评论(1编辑  收藏  举报