这次我们来学习下ExtJS中的树面板(TreePanel),很多人都说,只是为了树,都要好好学习ExtJS!可见大家对Tree的一往情深。从另一方面来说,Tree这种结构在实际项目中也的确用得相当广泛,所以我们很有必要研究一下它。这次我们完成的树大致上有这样的功能:它的节点是动态异步从后台(存储在数据库中一张电子产品分类表)加载的,节点之间可以拖曳,节点可以编辑,同时还支持右键菜单,而且,它能够和TabPanel结合构成经典的布局方式。呵呵,是不是很强大?!大家已经看到,我们组件的讲解是逐步递推的,所以我们这里也会用到刚学过的GridPanelTabPanel这些实用的面板。我们看效果先:

 

 

 

好啦,洪哥,我们动手吧!

 

1.      首先还是主要的显示页面tree.html,这里有两个地方要注意一下,一个是我们引用的JS如果采用GBK的默认编码,浏览器会显示未结束的字符串常量的错误,所以我们一般会修改JS文件的编码方式为UTF-8,或者在导入JS时加上编码字符集。第二个是我们要定义一个显示TreePanelDIV

 

<!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=UTF-8">

<title>Insert title here</title>

<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />

<script type="text/javascript" src="resources/js/ext-base.js"></script>

<script type="text/javascript" src="resources/js/ext-all.js"></script>

<script type="text/javascript" src="resources/js/tree.js" charset="gbk"></script>

</head>

<body>

<div >。祝愿大家学有所成。

 

 

 

 from:http://blog.csdn.net/lenotang/archive/2008/10/19/3102727.aspx

相关文章:

  • 2022-12-23
  • 2021-12-27
  • 2021-06-16
  • 2022-12-23
  • 2022-12-23
  • 2022-03-04
猜你喜欢
  • 2021-10-27
  • 2022-12-23
  • 2021-07-30
  • 2022-12-23
  • 2022-02-08
  • 2021-09-18
相关资源
相似解决方案