xtree,xloadtree API解析 和實例

js下載地址:http://download.csdn.net/detail/w5167839/7894001

XTREE API
本人英語不好,有誤請不要見怪, xtree api英文地址:http://webfx.eae.net/dhtml/xtree/api.html
---------------------------------------------------------
WebFXTreeAbstractNode
父類對象有共同的函數和方法被WebFXTree和WebFXTreeItem兩個子類對象繼承;


參數
id            Number     只讀屬性,節點的唯一ID
                              如果只讀HTML元素的id就能得到JS對象然後放入webFXTreeHandler集合. 
text              String    節點的文本            
action            String      響應關聯uri給節點
open              Boolean     只讀。返回節點是否打開 如果沒有子節點一直返回false
icon              String      節點圖像,未指定時
openIcon          String      節點打開時的圖像,未指定時
parentNode        Reference   關聯父節點
childNodes        Array       所有子節點

方法
add(oNode, [bNoIdent]) Reference  添加
indent()               void       縮進
toggle()               void    切換
expand()               void    打開樹節點
collapse()             void    關閉樹節點
expandAll()            Void       打開所有節點
collapseAll()          Void    關閉所有節點
getNextSibling()       Reference  得到前一兄弟節點
getPreviousSibling()   Reference  得到後一的兄弟節點
toString()             String     返回HTML格式
--------------------------------------------------------
WebFXTree

構造方法:
new WebFXTree([text], [action], [behavior])

參數
text              String    節點的文本            
action            String      響應關聯uri給節點
behavior          String      節點的行爲
icon              String      節點圖像,未指定時
openIcon          String      節點打開時的圖像,未指定時

屬性:
rendered 標誌位,boolean類型,表明樹是否已創建並渲染

方法
getSelected()           Reference 得到被選中的對象
setBehavior(sBehavior)  Void      默認爲classic,如果設置爲explore時可以使樹節點展示看起來更像windows Explore
getBehavior()           String    返回classic/explore

---------------------------------------
WebFXTreeItem
構造方法
new WebFXTreeItem([text], [action], [parent], [icon], [openIcon])

參數
text              String    節點的文本            
action            String      響應關聯uri給節點
parent            Reference   父節點(可選參數)
icon              String      節點圖像,未指定時
openIcon          String      節點打開時的圖像,未指定時

 

方法
getFirst() Reference 返回一個子節點的引用
getLast()  Reference 返回最後一個子節點的引用

實例
--------------------------------------------------------------
------------JSP             view

<%@ page language="java" pageEncoding="gbk"%>
</html>
<%--1.注意三個js文件和一個css文件,還需要一個images文件夾裏面放了顯示文件的圖片--%>
<script type="text/javascript" src="Js/xtree.js"></script>
<script type="text/javascript" src="Js/xmlextras.js"></script>
<script type="text/javascript" src="Js/xloadtree.js"></script>
<link type="text/css" rel="stylesheet" href="Js/xtree.css"></link>
<style type="text/css">
 body { background: white; color: black; }
 input { width: 120px; }
</style>
<body>
<script type="text/javascript">

/// XP Look
webFXTreeConfig.rootIcon		= "images/folder.png";
webFXTreeConfig.openRootIcon	          = "images/openfoldericon.png";
webFXTreeConfig.folderIcon		= "images/foldericon.png";
webFXTreeConfig.openFolderIcon	= "images/openfoldericon.png";
webFXTreeConfig.fileIcon		= "images/file.png";
webFXTreeConfig.lMinusIcon		= "images/Lminus.png";
webFXTreeConfig.lPlusIcon		= "images/Lplus.png";
webFXTreeConfig.tMinusIcon		= "images/Tminus.png";
webFXTreeConfig.tPlusIcon		= "images/Tplus.png";
webFXTreeConfig.iIcon		= "images/I.png";
webFXTreeConfig.lIcon		= "images/L.png";
webFXTreeConfig.tIcon		= "images/T.png";
//根節點;WebFXTree靜態類型;
var tree =new WebFXTree("xxxxxxxxxxxxxxxxxxx");
//第一個子節點;動態子節點;3個參數name,action,javascript動作;
var shz =new WebFXLoadTreeItem("xxxxxxxxx","xloadtree.action?orgid=00000000001651","javascript:void(0)");
tree.add(shz);
document.write(tree);
</script> 
</body>
</html>


 


------Servlet                 control

	@Override
	protected void service(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		req.setCharacterEncoding("gbk");
		String orgid = (String)req.getParameter("orgid");
		//注意返回格式;
		resp.setContentType("text/xml; charset=gbk");
		PrintWriter out =resp.getWriter();
		Base base = new Base();
		
		String selectData[] = {"o1.orgid","o1.nodename"};
		String fromData= "orgtree o1,orgtree o2";
		String whereData = "o2.nodeid = o1.parentid and o2.orgid = '"+orgid+"'";
		String str =base.select_XML(selectData,fromData,whereData);
		out.print(str);
	}


 -------------Base                                              model

/**將SQL結果處理XML
	 * @param selectData
	 * @param fromData
	 * @param whereData
	 * @return
	 *<?xml version="1.0" encoding="gbk"?><tree>
	 *<tree text="abc1" action="javascript:void(0)" src="xloadtree.action?orgid=abcd"  />
	 *   <tree text="abc12" action="javascript:void(0)" />	
	 *<tree text="abc2" action="javascript:void(0)" src="xloadtree.action?orgid=abcd" />
	 *</tree>
	 */
	public String select_XML(String selectData[],String fromData,String whereData){
		//select orgid,nodename from orgtree where orgid=abcd00141
		//設置查詢數據;
		Model model = new Model();
		model.setSelectData(selectData);
		model.setFromData(fromData);
		model.setWhereData(whereData);
		//返回數據;
		List<String> treeList = model.select();
		//建立XML格式;注意<tree>頂格寫不然讀取不出來
		String treeStr = "<?xml version=\"1.0\" encoding=\"gbk\"?><tree>";
		int t = -1;
		while(t<treeList.size()-1){
		  String orgid = treeList.get(++t).trim();
		  //<tree text="abc" action="javascript:void(0)" src="xloadtree.action?orgid=abcd"
		  treeStr += "<tree ";
				treeStr += "text=\""+treeList.get(++t).trim()+"\" ";
						//"action=\"javascript:window.location.reload()\"
				//判斷是否有子節點;
				if(!isChild(orgid))
					treeStr +=" src=\"xloadtree.action?orgid="+orgid+"\"";
				//注意" />"
				treeStr +=" />";
		}
		//注意</tree>
		treeStr +="</tree>";
		return treeStr;
	}
	/**
	 * 判斷是否有子節點;
	 * @param _orgid
	 * @return
	 */
	public boolean isChild(String _orgid) {
		//select y1.orgid from orgtree y1,orgtree y2
		//where y1.parentid = y2.nodeid and y2.orgid=_orgid; 
		Model model = new Model();
		String _selectData[] ={"y1.orgid"};
		model.setSelectData(_selectData);
		model.setFromData("shz_orgtree y1 , orgtree y2");
		model.setWhereData(" y1.parentid = y2.nodeid and y2.orgid='"+_orgid+"'");
		if(model.select().toString().equals("[]"))
		   return true;
		return false;
	}


 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章