betway必威手机版 > betway必威手机版登录 > 2异步获取节点

原标题:2异步获取节点

浏览次数:200 时间:2019-09-23

复制代码 代码如下:

由此XH奥迪Q5调用这几个get_nodes.asp文件,假使服务器再次回到这样三个JSON(有关JSON的牵线:
[{
"text":"yui-ext.js","id":"/yui-ext.js","leaf":true,"cls":"file"
} ,{
"text":"yui-ext-1118.php","id":"/yui-ext-1118.php","leaf":true,"cls":"file"
} ,{
"text":"yui-ext-1228.php","id":"/yui-ext-1228.php","leaf":true,"cls":"file"
} ,{
"text":"build","id":"/build","cls":"folder"
} ,{
"text":"source","id":"/source","cls":"folder"
} ,{
"text":"yui-ext-1123.php","id":"/yui-ext-1123.php","leaf":true,"cls":"file"
} ,{
"text":"yui-ext-1203.php","id":"/yui-ext-1203.php","leaf":true,"cls":"file"
} ]
  Server端JSON的输出(ASP JScript)  

            // set the root node 
            var root = new Tree.AsyncTreeNode({ 
                text: 'yui-ext',  
                draggable:false,  
                id:rootId 
            }); 
            tree.setRootNode(root); 

解释:
“text”-->展现的文本
"id"-->id值 
“leaf”-->Boolean值,如若“叶子”是真的话,则不可能蕴涵子节点Children nodes 
"cls"-->选用的体裁,日常在此间接选举定图标
”href“-->内定的url,还应该有一个”hrefTarget“的个性
别的,除了以上的性质,您还是能在JSON参与别的的习性,作为节点的习性,见杰克原话:
The href attribute is called "href", there's also an "hrefTarget" attribute. For capturing node clicks, you can listen on individual nodes or you can listen for "click" on the tree which will pass you the node that was clicked. FYI, you can put any attributes you want in the json config for the node and it will be available as node.attributes. FAQ.4会一而再解释那几个难题。
FQA常见难题:
1.Tree支撑XML数据交流吗?
A:暂不匡助,据FOURM上的话,今后会提供支撑,见:
can I use xml instead of json for sending nodes hirerachy ?
Correct me if I'm wrong but I think the answer is no here. But that doesn't mean it won't be supported later on. 
2.本身想用单击替代双击展开子节点,能够吧?
A:可以,见: 
tree.on('click', function(node){ 
    if(!node.isLeaf()){ 
        node.toggle(); 
    } 
}); 
3.事件管理的两种景况:
A: a.当参与有个别节点时,为其扩张事件 
tree.on('append', function(tree, node){ 
     if(node.id == 'foo'){ 
         // 这里加入你的事件(如click)侦听器(addListener())
     } 
});b.针对某些节点的单击事件 
tree.on('click', function(node){ 
     if(node.id == 'foo'){ 
         // do something 
     } 
});c.针对有个别区域(群集)的风浪 
// fires any time the selection in the tree changes 
tree.getSelectionModel().on('selectionchange', function(sm, node){ 
     if(node && node.id == 'foo'){ 
         // do something 
     } 
}); 
4.如何赢得JSON中的自定义字段(或称为参数 parameters)
A:JSON对象已经被构建函数 construction传递到TreeNode中,作为node.attributes 出现,所以调用属性node.attributes 便可得到。详见: 
tree.on('click', function(node){ 
    if(!node.isLeaf()){ 
        node.toggle(); 
    } 
});

var rootId = 1; 
var TreeTest = function(){ 
    // shorthand 
    var Tree = YAHOO.ext.tree; 

学习YUI.Ext 第五天--关于树TreePanel(Part 1) 
职能演示:
    树组件是YUI.Ext 0.40 新添的零部件。纵然YUI已经自带有TREE VIEW的零部件,但JACK依旧决定再一次开垦。具体原因在 (原文) 
一、加载三个一并Tree:

复制代码 代码如下:

var goods = new dbOpen(); 
goods.GetSQL ="select * from goodsbigclass"; 
with(goods){ 
    GetRS(1); 
    var str=""; 
    str ="["; 
    do{ 
        str ='{"text":"' rs("BigClassName") '","id":"/yui-ext.js","leaf":true,"cls":"file","href":"?b_id=' rs("BigClassID") '"},'; 
        rs.MoveNext(); 
    }while(!rs.EOF); 
    str ="]"; 
    Response.Write(str); 
    Close(); 

goods= null; 

            // render the tree 
            tree.render(); 

var TreeTest = function(){ 
var Tree = YAHOO.ext.tree;// 急忙情势 
return { 
    init : function(){ 
    var tree = new Tree.TreePanel('tree_div', {//须求一个tree_div的holder 
    animate:true, //是不是动画 
    loader: new Tree.TreeLoader({dataUrl:'get_nodes.asp'}), //调用三个JSON 
    enableDD:false,// 是不是帮衬拖放 
    containerScroll: true 
}); 
// 设置根节点 
var root = new Tree.AsyncTreeNode({ 
text: 'Frank的文章',  //根节点文字 
draggable:false, //根节点是还是不是可拖放 
id:'source' 
}); 
tree.setRootNode(root); 
// 渲染 tree 
tree.render(false,false); 
// false for not recursive (the default), false to disable animation 
root.expand(false,false); 

}; 
}(); 
YAHOO.ext.EventManager.onDocumentReady(TreeTest.init, TreeTest, true);

            //依据当下节点id,动态拼出诉求服务器的路线 
            //每发生多个节点,指向一个风浪的援引,将新建loader.dataUrl(具体育赛事件的机制还亟需再钻探) 
            //注意调用函数是beforeload 
            tree.on('beforeload', function(node){  
                tree.loader.dataUrl = 'calendarDetail.do?method=getDayDetailJSON&parentId=' node.id; 
            }); 

复制代码 代码如下:

            // false for not recursive (the default), false to disable animation 
            root.expand(); 
        } 
    }; 
}(); 

复制代码 代码如下:

本文由betway必威手机版发布于betway必威手机版登录,转载请注明出处:2异步获取节点

关键词:

上一篇:附代码详解

下一篇:没有了