天天看點

用DOJO做一個簡單的樹

聽聽聽聽聽 DOJO浣滀負涓?涓狫S妗嗘灦鏈夌潃鐩稿綋鐨勫簲鐢ㄤ環鍊鹼紝浣嗘槸鐜闆湪鍦ㄤ紬澶欴OJO鐨勮祫鏂欏綋涓緢灏戞湁涓?浜涙湁浠峰?肩殑涓滆タ锛岄兘寰堜貢銆備粠鐜闆湪璧鳳紝绗旇?呭皢闄嗙畫鐧誨嚭鏈夊叧DOJO鐨凙JAX鏂歸潰鐨勭浉鍏崇煡璇嗐??

聽聽聽聽聽 瑕佷嬌鐢―OJO瑕佸厛浠巋ttp://dojotoolkit.org/涓婁笅杞紻OJO鍖咃紝linux绯葷粺鍙互涓嬭澆Dojo Toolkit Release:tar.gz,win7绯葷粺 鍙互涓嬭澆zip.鐒跺悗鎶婂寘瑙e帇缂╀換浣曠洰褰曘?傛渶濂芥妸鍖呯殑鍚嶅瓧鏀圭殑绠?鍗曚竴浜涳紝姣斿JS杩欐牱鍙互渚誇笌寮曠敤 锛?

聽聽聽聽 涓嬮潰鍋氫竴涓畝鍗曠殑椤甸潰锛宨ndex.jsp

<%@ page language="java" contentType="text/html; charset=GB18030"

pageEncoding="GB18030"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=GB18030">

<title>Insert title here</title>

<link rel="stylesheet" type="text/css" href="http://o.aolcdn.com/dojo/1.1/dojo/resources/dojo.css" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" mce_href="http://o.aolcdn.com/dojo/1.1/dojo/resources/dojo.css" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" />

<link rel="stylesheet" type="text/css" href="http://o.aolcdn.com/dojo/1.1/dijit/themes/tundra/tundra.css" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" mce_href="http://o.aolcdn.com/dojo/1.1/dijit/themes/tundra/tundra.css" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" />

<mce:script type="text/javascript" src="js/dojo/dojo.js" mce_src="js/dojo/dojo.js" djConfig="parseOnLoad:true,isDebug:true"></mce:script>

<mce:script type="text/javascript"><!--

dojo.require("dijit.Tree");

dojo.require("dojo.data.ItemFileReadStore");

dojo.require("dojo.parser");

// --></mce:script>

</head>

<body class="tundra">

<div dojoType="dojo.data.ItemFileReadStore" jsId="dataStore" url="programmingLanauages.json">

333

</div>

<div dojoType="dijit.tree.TreeStoreModel" jsId="model" store="dataStore" query="{name:'*'}">

111

</div>

<div dojoType="dijit.Tree" model="model">

</div>

</body>

</html>

.

鍙渶鎶奃OJO SDK浣滀負script 寮曠敤鍗沖彲銆?

杩欓鏍戣璇誨彇JSON鏂囨。鏍煎紡鐨勫唴瀹癸細

{

identifier:'name',

label:'name',

items:[

{

name:'Programming Languages',

children:[

{name:'JavaScript'},

{name:'Python'},

{name:'C++'},

{name:'Erlang'},

{name:'Prolog'}

]

}

]

}

娉ㄦ剰JSON鐨勬枃浠惰涓?JSP椤甸潰鍦ㄥ悓涓?鐩綍涓嬨??

杩欐牱涓?涓爲灏辨垚浜嗭紒

繼續閱讀