您的位置：首页 > Web前端 > JavaScript

jsTree插件的应用

2013-10-01 21:36 274 查看

从服务器端动态的获取数据：

在浏览器页面中：客户端

<html>

<head>

<base href="<%=basePath%>">

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

<title>CMS 后台管理工作平台</title>

<script type="text/javascript" src="js/jquery-1.10.2.js"></script>

<script type="text/javascript" src="js/jquery.jstree.js"></script>

<script language="javascript">

//第二种写法,注意是添加attr

$(function() {

//将menuContainer变成一棵树！

$("#demo").jstree( {

"json_data" : {

"ajax" : {

//通过URl从服务器拿到数据

"url" : "XXXX.action?method:tree"

}

},

"plugins" : [ "themes", "json_data" ]

});

});

</script>

<style type="text/css">



</style>

</head>

<body>

<div id="demo">

</div>

</body>

</html>

服务器端：

public void tree()

{

try

{

//添加数据

Node root = new Node("大学",1,"www.baidu.com");

root.addChildNode(new Node("办公室",2,"www.csdn.com"));

root.addChildNode(new Node("学籍科",3,"www.sina.com"));

//把存储的数据解析存到JSON 中

String str = JSONMapper.toJSON(root).render(false);

//设置编码方式

ServletActionContext.getResponse().setCharacterEncoding("UTF-8");

//输出到客户端

ServletActionContext.getResponse().getWriter().print(str);

} catch (MapperException e)

{

e.printStackTrace();

} catch (IOException e)

{

e.printStackTrace();

}

}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航