easy-ui的data-options用法

原文地址：http://www.cnblogs.com/missmz/p/6509860.html

頁面代碼部分：

<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');
}
});
}