【?】Extjs4的树节点监听？

tree.jsp
<%@ page language="java"  pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>用户管理</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
    <link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css" />
    <script type="text/javascript" src="../ext-all.js"></script>
    <script type="text/javascript" src="../locale/ext-lang-zh_CN.js"></script>
    <script type="text/javascript">
    Ext.onReady(function(){


//treeStore
var treeStore = Ext.create('Ext.data.TreeStore', {
    //fields:[{name:"id",type:"string"},{name:"name",type:"string"}],
    proxy:{
type:"ajax",
reader:{type:"json"},
url:"tree4Server.jsp?id=1"
},autoLoad:true,

     root: {
        expanded: true,
        itemid : 'itemid',//指定节点参数名
        children: [
            { 'text': "家谱1", expanded: true, children: [
                { 'text': '张姓', 'leaf': true ,'id':'1','url':'lizi/tree4Server.jsp'},
                { 'text': '李姓', 'leaf': true ,'id':'2','url':'lizi/tree4Server.jsp'}
            ]}
        ]}
           });

var tpanel = Ext.create('Ext.tree.Panel', {
        store: treeStore,
    id:'t_id',
        title: '基础查询',
        width:200,
        colspan:1,   //占一列
    rootVisible: false,
    renderTo: Ext.getBody(),

    /**
    itemclick( Ext.view.View this, Ext.data.Model record, HTMLElement item, Number index, Ext.EventObject e, Object eOpts )
Fires when an item is clicked.
Parameters
    this : Ext.view.View
    record : Ext.data.Model

    The record that belongs to the item
    item : HTMLElement

    The item's element
    index : Number

    The item's index
    e : Ext.EventObject

    The raw event object
    eOpts : Object

    The options object passed to Ext.util.Observable.addListener.

    */
    listeners:{
            itemclick:function(m,r,d,e,t){
var url=treeStore.getById(r.get("id"));
Ext.Msg.alert("url",url);

//if(treeStore.getById(itemid)){
  // var url=treeStore.getById(itemid).get("url");

//var url='lizi/tree4Server.jsp';
//Ext.Msg.alert("itemid",url);
                //}
             }
          }
       });


var gpanel = Ext.create('Ext.grid.Panel', {
            title: '列表',
            width:600,
            colspan:1,
            renderTo: Ext.getBody(),
            store: {
        fields: [{id:'id',type:'number'},{name:'name',type:"string"},{name:'salary',type:"string"},{name:'birthday',type:"date"},{name:'bool',type:"boolean"}],

        proxy:{
            type: 'ajax',
            url: 'lizi/tree4Server.jsp',
            //data : datas,
            reader:{type:"json"}
        },
        autoLoad: true
    },

    selModel:new Ext.selection.CheckboxModel({mode:"MULTI"}),
        columnLines:true,

              columns: [
                  {
                      xtype: 'numbercolumn',
                      dataIndex: 'id',
                      text: 'id'
                  },
                  {
                      xtype: 'gridcolumn',
                      dataIndex: 'name',
                      text: 'name'
                  },
                  {
                      xtype: 'numbercolumn',
                      dataIndex: 'salary',
                      text: 'salary'
                  },
                  {
                      xtype: 'datecolumn',
                      dataIndex: 'birthday',
                      text: 'birthday'
                  },
                  {
                      xtype: 'booleancolumn',
                      dataIndex: 'bool',
                      text: 'bool'
                  }]
         });


var zpanel = Ext.create('Ext.panel.Panel',{
title :'布局示例',
//layout : 'column',
layout:{
    type:'table', //table布局
    columns:2
    },

frame :true,
height : 700,
width : 1000,
//renderTo: Ext.getBody(),
defaults : {
bodyStyle:'background-color:#FFFFFF;',
height : 500,
frame : true
},
});

zpanel.add(tpanel);
     zpanel.add(gpanel);

     zpanel.render(Ext.getBody());
});

       /**
//数据准备
var _rzdatas = [
['刘备','蜀国','2011/12/1','192.168.0.1','用户登录','登录','成功'],
['张飞','蜀国','2011/12/1','192.168.0.1','用户修改','修改','成功'],
['关羽','蜀国','2011/12/1','192.168.0.1','比对实例','增加','成功']
];
//注册数据模型
Ext.regModel("rzmodel",{
fields:['czyh','czsujg','czsj','ip','czdxlx','czlx','czjg'],
        proxy:{
        type:'memory',
        //data:_xxdatas,
        reader:'array'
        }
});
//准备数据集
var _rzStore = new Ext.data.Store({
autoLoad:true,
data:_rzdatas,
model:'rzmodel'
});
  */

    </script>  </head>



  <body>
  </body>
</html>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

tree4server.jsp
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%
String itemId = request.getParameter("id");
String result="";
if("1".equals(itemId)){
result = "{'id':'1','name':'张三','salary':'2311','birthday':new Date(1979,09,13),'bool':true}";
}else if("2".equals(itemId)){
result = "{'id':'2','name':'李四','salary':'2033','birthday':new Date(1978,10,01),'bool':false}";
}
response.getWriter().write(result);
%>
改成这样试试
listeners:{
            itemclick:function(m,r,d,e,t){
            var url=treeStore.getById(r.raw.id);

             }
             }
          });
    listeners:{
                  itemclick:function(m,r,d,e,t){
var ids=r.store.getAt(e).get("id");
         //创建Ajax代理
var ajaxProxy = new Ext.data.proxy.Ajax({
url : 'tree4Server.jsp',
model: 'rzmodel',
    reader: 'json'
               });
//创建请求参数对象
var operation = new Ext.data.Operation({
    action: 'read',//设置请求动作为read,
    id:ids
});
//读取数据
ajaxProxy.doRequest(operation,callBack);
//doRequest方法的回调函数
function callBack(operation){
//获取原始响应数据
var responseText = operation.response.responseText;

_rzStore.removeAll();
_rzStore.add(Ext.decode(responseText));

};
                 }
        }
var url=treeStore.getById(r.raw.id);
??