easyui是一個基于jQuery實現的UI框架,支持豐富的UI控件,同時也非常易于使用。為了能夠在easyui中展示數據,我們需要使用JSON來表示數據。在easyui中如何讀取JSON數據呢?
$('#datagrid').datagrid({ url: 'data.json', method: 'get', // 映射數據 columns: [[ {field:'id',title:'ID',width:100}, {field:'name',title:'姓名',width:100}, {field:'age',title:'年齡',width:100} ]] });
上面的代碼是讀取data.json文件中的數據,并將數據映射到datagrid組件中。
[ {"id":1,"name":"張三","age":23}, {"id":2,"name":"李四","age":30}, {"id":3,"name":"王五","age":18}, {"id":4,"name":"趙六","age":25}, {"id":5,"name":"田七","age":36} ]
上面的代碼是data.json文件中的數據,其中每個對象代表一行數據,對象的屬性對應datagrid組件的列。需要注意的是,JSON數據必須是數組形式,即使只有一條記錄。
通過以上方法,easyui可以很方便地讀取JSON數據,并展示在頁面上。如果數據需要修改、刪除、新增操作,可以通過擴展easyui的datagrid組件實現這些功能。
上一篇c 將json