JqueryツリーコントロールZTree非同期ロード
1923 ワード
転載は出典を明記してください:jiq・欽's technical Blog
非同期ロードとは、展開ツリーノードをクリックすると、バックグラウンドactionにクリックノードのサブノードデータを返してロードするように要求することを意味します.
ここでは主にztreeのsetting変数のasyncプロパティ設定を設計します.
ツリーノードの展開をクリックするとurlで指定したactionにサブノードデータの取得を要求しztreeにバインドされます.ここでバックグラウンドactionはJSON文字列を返し、ztreeは新しいノードデータをバインドして配列のみを受信するので、バインド前にfilter関数でデータ洗浄変換操作を行い、文字列を配列に変換する必要があります.
これによりztreeツリーノードを展開するとactionにサブノードデータの取得とバインドを要求する.
次に、バックグラウンドactionの実装を示します.
非同期ロードとは、展開ツリーノードをクリックすると、バックグラウンドactionにクリックノードのサブノードデータを返してロードするように要求することを意味します.
ここでは主にztreeのsetting変数のasyncプロパティ設定を設計します.
var setting = {
async: {
enable: true,
url:"InitServiceIpsData.action",
autoParam:["id", "name"],
dataFilter: filter
},
ツリーノードの展開をクリックするとurlで指定したactionにサブノードデータの取得を要求しztreeにバインドされます.ここでバックグラウンドactionはJSON文字列を返し、ztreeは新しいノードデータをバインドして配列のみを受信するので、バインド前にfilter関数でデータ洗浄変換操作を行い、文字列を配列に変換する必要があります.
// ztree
function filter(treeId, parentNode, childNodes) {
if (!childNodes)
return null;
childNodes = eval("("+childNodes+")"); // [{id:103,pId:1,name:' 3'}];
return childNodes;
}
これによりztreeツリーノードを展開するとactionにサブノードデータの取得とバインドを要求する.
次に、バックグラウンドactionの実装を示します.
public String InitServiceIpsData()
{
HttpServletRequest request = ServletActionContext.getRequest();
String id = request.getParameter("id");
String name = request.getParameter("name");
System.out.println(" "+name+" ip ");
List<HashMap<String,Object>> list = new ArrayList<HashMap<String,Object>>();
for(int i = 1; i <= 2; i++){
HashMap<String,Object> hm = new HashMap<String,Object>();
hm.put("id", id + "0" + i);
hm.put("pId", id);
hm.put("name", name + "_IP_" + i);
hm.put("isParent", false);
list.add(hm);
}
JSONArray finalJson = JSONArray.fromObject(list);
this.initServiceIpsData = finalJson.toString();
return SUCCESS;
}