extjs动态树的生成。

运行结果:


数据库字段取名非常重要,要与ext.Tree中对应。id  text  url(href)



js代码:

Ext.TESTTREE.Model = {
    nodeStore: Ext.create('Ext.data.TreeStore', {
        model: 'NodeModel',
	    proxy: {
	        type: 'ajax',
	        url: Ext.TESTTREE.NodeConfig.NodeQueryUrl
	    }
	})
}

Ext.define('NodeModel', { 
    extend: 'Ext.data.Model', 
    fields: [  
		     {name:'id',mapping:'id'},
		     {name:'text'},
		     {name:'leaf'},
		     {name:'url'}
    ]
});
Ext.TESTTREE.NodeConfig={
	NodeQueryUrl:"/tool-license/treeNode/listTreeNode.do",
};
var MenuTree=Ext.create('Ext.tree.Panel', {
    title: 'Simple Tree',
   	displayField: 'text',
    region: 'west',
    width: '16%',
    autoScroll: true,
    store: Ext.TESTTREE.Model.nodeStore,
	rootVisible: false,
});
Ext.create('Ext.container.Viewport', {
    layout: 'border',
 	 defaults: {
            collapsible: true,
            split: true,
            bodyStyle: 'padding: 10px'
        },
    items: [TopPanel,MenuTree, MainPanel, FooterPanel],
});


主要java代码:
// 控制层
	
@Controller
@RequestMapping("/treeNode")
public class TreeNodeController {
	private TreeNodeService treeNodeService;

	@Autowired
	public TreeNodeController(TreeNodeService treeNodeService) {
		this.treeNodeService = treeNodeService;
	}

	@RequestMapping("/listTreeNode.do")
	@ResponseBody
	public void listTreeNode(@RequestParam("id") String parentId,
			HttpServletResponse response) throws IOException {
		response.setCharacterEncoding("utf-8");
		// System.out.println(parentId+"++++++++++++++++++");

		List<TreeNode> nodes = treeNodeService.listClildren(parentId);
		StringBuilder jsonData = new StringBuilder();
		if (nodes.size() > 0) {
			jsonData.append("[");
			for (TreeNode treeNode : nodes) {
				{
					// System.out.println(treeNode.getHref()+"==============href");
					ToTreeNode json = new ToTreeNode();
					boolean leaf = (treeNodeService.listClildren(treeNode
							.getLevel())).size() == 0 ? true : false;
					String node = json.ToTreeNode(treeNode.getLevel(),
							treeNode.getText(), leaf,treeNode.getUrl()).toString();
					jsonData.append(node);
					jsonData.append(",");
				}
			}
			// 去掉末尾“,”号
			jsonData.deleteCharAt((Integer) (jsonData.length() - 1));
			jsonData.append("]");
		}
		response.getWriter().write(jsonData.toString());
	}
}

public class ToTreeNode {
	 public StringBuilder ToTreeNode(String id, String text, boolean leaf,String url){
	        StringBuilder jsonData = new StringBuilder();

	        jsonData.append("{");
	        jsonData.append("id:'");
	        jsonData.append(id);
	        jsonData.append("',text:'");
	        jsonData.append(text);
	        jsonData.append("',leaf:'");
	        jsonData.append(leaf);
	        jsonData.append("',url:'");
	        jsonData.append(url);
	        jsonData.append("'}");
	        return jsonData;
	    }
}




评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值