頁面代碼部分:
<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'); } }); }