extjs6 非同步樹
阿新 • • 發佈:2018-12-27
store定義:
Ext.define('permissionStore', {
extend: 'Ext.data.TreeStore',
defaultRootId: ' ',
autoLoad:true,
model: 'permissionModel',
parentIdProperty: 'FartherId',
nodeParam: 'id',
sorters: [{ property: 'OrderNumber', direction: 'ASC' }],
proxy: {
type: 'ajax' ,
url: '/frame/ListPermission',
actionMethods: { read: 'post' },
reader: {
rootProperty: 'rows',
totalProperty: 'total'
}
}
});
defaultRootId: ’ ‘,是很重要的配置,用來初始化向後臺傳遞的引數,即頁面啟動時向後臺發起的查詢引數。
nodeParam: ‘id’,是定義引數名,
後臺程式碼:
public JsonResult ListPermission(string Id)
{
string fartherId = Id.Trim ();
fartherId = fartherId == "0" ? null : fartherId;
DataTable dt = new PermissionImpl().GetList(fartherId);
dt.Columns.Add("iconCls");
foreach(DataRow dr in dt.Rows)
{
dr["iconCls"] = dr["icon"];
}
dt.Columns .RemoveAt(dt.Columns.IndexOf("icon"));
return Json(Common.DataGrid(dt));
}
因為資料庫中儲存的icon中的值是css樣式定義,而extjs中的icon屬性是url包含,所以將返回中的icon去掉,加入了iconCls,這樣可以的樹中顯示圖示。