iteye_566 2010-06-22 13:52
浏览 231
已采纳

求一个例子：extjs树形菜单动态从后台加载节点的实例

本人目前在自学extjs,读的相关书籍是《深入浅出extjs》但是对于本书中的树形菜单动态加载节点以及相关节点的加载和点击事件，总是不能写出满意的例子来，希望各位中能抽出时间的帮忙写一个完整的实例，（可以写成jsp+servlet的，容易一些)要求：
首先，加载所有节点，然后再点击节点的时候能够进行请求提交。当然了，所有的节点都是动态从servlet中取到的。谢谢了。。。

  • 写回答

3条回答

  • upup1000 2010-06-22 15:35
    关注

    TreeSevice
    [code="java"]
    package name.sencha;

    public class TreeService {
    public String getLevel1Nodes(){
    return "[{text:\"北京\", id:\"1\"},{text:\"吉林\", id:\"2\"}]";
    }

    public String getLevel2Nodes(){
    return "[{text:\"丰台\", id:\"1-1\"},{text:\"海淀\", id:\"1-2\", leaf:true},{text:\"东城\", id:\"1-3\", leaf:true},{text:\"西城\", id:\"1-4\", leaf:true}]";
}

public String getLevel3Nodes(){
    return "[{text:\"长春\", id:\"2-1\", leaf:true},{text:\"吉林\", id:\"2-2\", leaf:true},{text:\"白山\", id:\"2-3\", leaf:true},{text:\"白城\", id:\"2-4\", leaf:true}]";
}

public String getLevel4Nodes(){
    return "[{text:\"丰台1区\", id:\"1-1-1\", leaf:true},{text:\"丰台2区\", id:\"1-1-2\", leaf:true},{text:\"丰台3区\", id:\"1-1-3\", leaf:true},{text:\"丰台小学\", id:\"1-1-4\", leaf:true}]";
}

public String getTreeNodeS(String id){
    if(id==null||id.length()==0){
        return "[]";
    }else if(id.equals("0")){
        return getLevel1Nodes();
    }else if(id.equals("1")){
        return getLevel2Nodes();
    }else if(id.equals("2")){
        return getLevel3Nodes();
    }else{
        return getLevel4Nodes();
    }
}

    }

    [/code]

    TreeServlet :
    [code="java"]
    package name.sencha;

    import java.io.IOException;

    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    public class TreeServlet extends HttpServlet{
    @Override
    public void doPost(HttpServletRequest request, HttpServletResponse response){
    String id = request.getParameter("id");
    if(id!=null&&id.length()>0){
    TreeService service = new TreeService();
    try {
    response.setCharacterEncoding("UTF-8");
    response.getWriter().write(service.getTreeNodeS(id));
    } catch (IOException e) {
    // TODO Auto-generated catch block
    e.printStackTrace();
    }
    }
    }

    @Override
public void doGet(HttpServletRequest request, HttpServletResponse response){
    doPost(request, response);
}

    }

    [/code]

    web.xml:
    [code="java"]

    treeservlet
    name.sencha.TreeServlet


    treeservlet
    /tree

    [/code]

    html :
    [code="html"]
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">



    Ext.onReady(function(){ Ext.BLANK_IMAGE_URL = "../../ext-3.0.0/resources/images/default/s.gif"; var rootNode = new Ext.tree.AsyncTreeNode({ text : "根", id : "0", expanded : true }); var tree = new Ext.tree.TreePanel({ root : rootNode, loader : new Ext.tree.TreeLoader({ dataUrl : "../../tree" }), width : 200, height : 400 }); tree.on("beforeload" , function(node){ tree.loader.baseParams.id = node.id; }); tree.on("click", function(node){ Ext.Ajax.request({ url : "../../tree", params : {id:1}, success : function(res){ var txt = res.responseText; var obj = Ext.decode(txt); alert(obj.length); } }); }); tree.render(Ext.get("tree_div")); });

    Insert title here



    [/code]

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题？

悬赏问题

  • ¥15 如何提取csv文件中需要的列，将其整合为一篇完整文档，并进行jieba分词(语言-python)
  • ¥15 MapReduce结果输出到HBase，一直连接不上MySQL
  • ¥15 扩散模型sd.webui使用时报错“Nonetype”
  • ¥15 stm32流水灯＋呼吸灯＋外部中断按键
  • ¥15 将二维数组，按照假设的规定，如0/1/0 == "4"，把对应列位置写成一个字符并打印输出该字符
  • ¥15 NX MCD仿真与博途通讯不了啥情况
  • ¥15 win11家庭中文版安装docker遇到Hyper-V启用失败解决办法整理
  • ¥15 gradio的web端页面格式不对的问题
  • ¥15 求大家看看Nonce如何配置
  • ¥15 Matlab怎么求解含参的二重积分？