EasyUI Tree Ajax

easyui的ajax树默认只会把当前节点的id传给后台，如果我想传多个参数呢，这时候你就不得不去修改源代码了，其实也很容易做到，easyui的svn地址是http://jquery-easyui.googlecode.com/svn/trunk，里面有源码。

1.由于easyui的js文件时经过压缩之后的，所以直接改动jquery.easyui.min.js不是一个好办法，我们可以直接改动src/jquery.tree.js，tree的源码还是很清晰的，她采用<ul><li><div><span></span></div></li></ul>的结构来构造一棵树，支持html和json两种数据方式，其实easyui的其他插件也都支持html和json两种方式，这也是我喜欢easyui的原因之一，废话不多说，在tree.html里引用<script type="text/javascript" src="../src/jquery.tree.js"></script>，注意一定要放在<script type="text/javascript" src="../jquery.easyui.min.js"></script>下面，就是让jquery.tree.js覆盖jquery.easyui.min.js里面有关tree部分的代码，只让jquery.tree.js生效。

 

2.接下来的事情就很容易了，在jquery.tree.js里，展开节点的函数为expandNode

function expandNode(target, node){
		var opts = $.data(target, 'tree').options;
		
		var hit = $('>span.tree-hit', node);
		if (hit.length == 0) return;	// is a leaf node
		
		if (hit.hasClass('tree-collapsed')){
			hit.removeClass('tree-collapsed tree-collapsed-hover').addClass('tree-expanded');
			hit.next().addClass('tree-folder-open');
			var ul = $(node).next();
			if (ul.length){
				if (opts.animate){
					ul.slideDown();
				} else {
					ul.css('display','block');
				}
			} else {
				var id = $.data($(node)[0], 'tree-node').id;
				var subul = $('<ul></ul>').insertAfter(node);				
				request(target, subul, {id:id});	// request children nodes data
			}
		}
	}

 我们看到

request(target, subul, {id:id});

这一句，默认传的是id，采用post方法，如果想传多个的话就改这里吧。