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方法,如果想传多个的话就改这里吧。