yate330 2009-04-06 10:13
浏览 292
已采纳

为什么tree panel的checkbox没有显示??

主页面jsp,我把这个页面放到tomcat后运行,tree的checkbox没有显示了,请问下这是为什么,代码帖在下面,附件中有完整可以运行的代码
[code="java"]
<!DOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@page contentType="text/html" pageEncoding="UTF-8" %>








try{ Ext.onReady(function (){ Ext.QuickTips.init(); new Ext.Viewport({ renderTo:'myViewPort', layout:'border', items:[{ id:'northPanel', region:'north', xtype:'panel', title:'top', height:'100', margins:'5 5 0 5', collapsible:true, collapsed:true },{ xtype:'panel', id:'leftPanel', region:'west', title:'left', width:170, collapsible:true, border:true, autoScroll:true, layout:'accordion', layoutConfig:{ animate:true }, collapseFirst:false, margins:'5', items:[{ xtype:'panel', title:'baseUsr', frame:true, layout:'accordion', layoutConfig:{ animate:true }, items:[{ title:'target', items:[{ xtype:'panel', labelWidth:30, labelAlign:'right', layout:'form', buttonAlign:'center', items:[{ html:'<br /><br /><br />' },{ xtype:'combo', id:'cityCbId', width:120, valueField:'CITY_ID', displayField:'CITY_DESC', editable:false, mode:'local', triggerAction:'all', fieldLabel:'city', emptyText:'please choice city' },{ xtype:'combo', id:'countryCbId', width:120, valueField:'COUNTY_ID', fieldLabel:'country', displayField:'COUNTY_DESC', editable:false, mode:'local', disabled:true, triggerAction:'all', emptyText:'please choice' },{ xtype:'combo', id:'channelCbId', width:120, valueField:'CHANNEL_ID', disabled:true, displayField:'CHANNEL_NAME', editable:false, mode:'local', triggerAction:'all', fieldLabel:'channelNm', emptyText:'please choice channelNm' }], buttons:[{ text:'commit', handler:function(){ } }] }] },{ title:'picControl', items:[{ html:'<div id="showTreeId"></div>' }] },{ title:'channSear', layout:'form', labelWidth:30, labelAlign:'left', items:[{ html:'<br /><br />' },{ xtype:'combo', id:'hy_chanSeaCbCity', fieldLabel:'city', width:90, valueField:'CITY_ID', displayField:'CITY_DESC', editable:false, mode:'local', triggerAction:'all', emptyText:'please choice region' },{ xtype:'combo', id:'hy_chanSeaCbCountry', fieldLabel:'country', width:90, disabled:true, valueField:'COUNTY_ID', mode:'local', displayField:'COUNTY_DESC', triggerAction:'all', emptyText:'please choice country' },{ xtype:'combo', id:'hy_chanSeaCbType', fieldLabel:'chanType', labelStyle:'width:55', valueField:'index', mode:'local', displayField:'returnChannelType', width:67, triggerAction:'all', emptyText:'please choice channel' },{ xtype:'textfield', fieldLabel:'channCode', id:'hy_channelCode', labelStyle:'width:55', width:83 },{ xtype:'textfield', id:'hy_channelName', fieldLabel:'channNm', labelStyle:'width:55', width:83 },{ xtype:'button', text:'search', handler:function(){ } }] },{ title:'Search', layout:'table', defaultType:'textfield', items:[{ xtype:'textfield', id:'searchMapPoiId', style: 'margin: 15px 6px 15px 2px', width:90 },{ xtype:'button', text:'Search', handler:function(){ } }] }] },{ xtype:'panel', title:'chanAssAdd', layout:'form', frame:true },{ xtype:'panel', title:'channelListener', layout:'form', frame:true },{ xtype:'panel', title:'chanManSear', layout:'form', frame:true },{ xtype:'panel', title:'zhongSea', frame: true, layoutConfig:{ animate:true }, items:[{ xtype:'panel', title:'nowdaysTingSea', collapsible:true, titleCollapse:true, labelAlign:'left', defaultType:'textfield', labelWidth:55, width:155, frame:true, layout:'form', items:[{ xtype:'datefield', id:'hy_gradeTime_1', fieldLabel:'time1', format:'Y-m-d', width:73 },{ xtype:'datefield', id:'hy_gradeTime_2', fieldLabel:'time2', format:'Y-m-d', width:73 },{ xtype:'combo', id:'hy_newInsPeo_combox', fieldLabel:'newPeople', width:70 },{ fieldLabel:'Nm', labelStyle:'width:70', width:70, allowBlank:false },{ xtype:'button', text:'Search', buttonAlign:'right', handler:function(){ } }] }] },{ xtype:'panel', title:'regMan', layout:'form', frame:true },{ xtype:'panel', title:'adAssDesigner', layout:'form', frame:true }] },{ id:'contentView', region:'center', layout:'fit', border:false, items:{ xtype:'panel', id:'mainPanel', layout:'border', border:false, items:[{ xtype:'panel', id:'mainMapPanel', region:'center', margins:'5 5 5', split:false, collapsible:false, plain:false, defaults:{autoScroll:true}, enableTabScroll:true, autoDestroy:true },{ id:'southPanel', title:'south', region:'south', collapsible:true, margins:'0 5 5', height:30, minSize:150, maxSize:220 }] } }] }) new Ext.tree.TreePanel({ renderTo:'showTreeId', width:130, height:200, checkModel:'cascade', onlyLeafCheckable: true, animate: false, rootVisible: false, autoScroll:true, loader: new Ext.tree.TreeLoader({ dataUrl:'getNodes.jsp', baseAttrs: {uiProvider: Ext.ux.TreeCheckNodeUI } }), root: new Ext.tree.AsyncTreeNode({ id:'aa',text:'roodNode' }) }); }); }catch(e){alert(e + ' ' + e.message + ' ' + e.name + '\n' + e.stack)}


[/code]

[code="java"]
Ext.ux.TreeCheckNodeUI = function() {

this.checkModel = 'cascade';

//only leaf can checked
this.onlyLeafCheckable = false;

Ext.ux.TreeCheckNodeUI.superclass.constructor.apply(this, arguments);

};

Ext.extend(Ext.ux.TreeCheckNodeUI, Ext.tree.TreeNodeUI, {

renderElements : function(n, a, targetNode, bulkRender){
    var tree = n.getOwnerTree();
    this.checkModel = tree.checkModel || this.checkModel;
    this.onlyLeafCheckable = tree.onlyLeafCheckable || false;

    // add some indent caching, this helps performance when rendering a large tree
    this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';
    //debugger;
    //var cb = typeof a.checked == 'boolean';
    var cb = (!this.onlyLeafCheckable || a.leaf);
    var href = a.href ? a.href : Ext.isGecko ? "" : "#";
    var buf = ['<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf x-unselectable ', a.cls,'" unselectable="on">',
        '<span class="x-tree-node-indent">',this.indentMarkup,"</span>",
        '<img src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow" />',
        '<img src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',
        cb ? ('<input class="x-tree-node-cb" type="checkbox" ' + (a.checked ? 'checked="checked" />' : '/>')) : '',
        '<a hidefocus="on" class="x-tree-node-anchor" href="',href,'" tabIndex="1" ',
         a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '><span unselectable="on">',n.text,"</span></a></div>",
        '<ul class="x-tree-node-ct" style="display:none;"></ul>',
        "</li>"].join('');

    var nel;
    if(bulkRender !== true && n.nextSibling && (nel = n.nextSibling.ui.getEl())){
        this.wrap = Ext.DomHelper.insertHtml("beforeBegin", nel, buf);
    }else{
        this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf);
    }

    this.elNode = this.wrap.childNodes[0];
    this.ctNode = this.wrap.childNodes[1];
    var cs = this.elNode.childNodes;
    this.indentNode = cs[0];
    this.ecNode = cs[1];
    this.iconNode = cs[2];
    var index = 3;
    if(cb){
        this.checkbox = cs[3];
        Ext.fly(this.checkbox).on('click', this.check.createDelegate(this,[null]));
        index++;
    }
    this.anchor = cs[index];
    this.textNode = cs[index].firstChild;
},

// private
check : function(checked){
    //debugger;
    var n = this.node;
    var tree = n.getOwnerTree();


    this.checkModel = tree.checkModel || this.checkModel;

    if( checked === null ) {
        checked = this.checkbox.checked;
    } else {
        this.checkbox.checked = checked;
    }

    n.attributes.checked = checked;
    tree.fireEvent('check', n, checked);

    if(this.checkModel == 'single'){
        var checkedNodes = tree.getChecked();
        for(var i=0;i<checkedNodes.length;i++){
            var node = checkedNodes[i];
            if(node.id != n.id){
                node.getUI().checkbox.checked = false;
                node.attributes.checked = false;
                tree.fireEvent('check', node, false);
            }
        }
    } else if(!this.onlyLeafCheckable){
        if(this.checkModel == 'cascade' || this.checkModel == 'parentCascade'){
            var parentNode = n.parentNode;
            if(parentNode !== null) {
                this.parentCheck(parentNode,checked);
            }
        }
        if(this.checkModel == 'cascade' || this.checkModel == 'childCascade'){
            if( !n.expanded && !n.childrenRendered ) {
                n.expand(false,false,this.childCheck);
            }else {
                this.childCheck(n);  
            }
        }
    }
},


// private
childCheck : function(node){
    //debugger;
    var a = node.attributes;
    if(!a.leaf) {
        var cs = node.childNodes;
        var csui;
        for(var i = 0; i < cs.length; i++) {
            csui = cs[i].getUI();
            if(csui.checkbox.checked ^ a.checked)
                csui.check(a.checked);
        }
    }
},

// private
parentCheck : function(node ,checked){
    //debugger;
    var checkbox = node.getUI().checkbox;
    //debugger;
    if(typeof checkbox == 'undefined')return ;
    if(!(checked ^ checkbox.checked))return;
    if(!checked && this.childHasChecked(node))return;
    checkbox.checked =checked;
    node.attributes.checked =checked;

    node.getOwnerTree().fireEvent('check', node, checked);

    var parentNode = node.parentNode;
    if( parentNode !== null){
        this.parentCheck(parentNode,checked);
    }
},

// private
childHasChecked : function(node){
    var childNodes = node.childNodes;
    if(childNodes || childNodes.length>0){
        for(var i=0;i<childNodes.length;i++){
            if(childNodes[i].getUI().checkbox.checked)
                return true;
        }
    }
    return false;
},

toggleCheck : function(value){
    var cb = this.checkbox;
    if(cb){
        var checked = (value === undefined ? !cb.checked : value);
        this.check(checked);
    }
}

});

[/code]

我在tomcat下运行第1个jsp页面,显示的树没有checkbox了?
请问下谁可以看下是什么问题,谢谢!

  • 写回答

2条回答 默认 最新

  • 阿健 2009-04-13 13:28
    关注

    看样子,你是使用了TreeCheckNodeUI这个扩展的tree组件来实现的checkbox功能。但TreeCheckNodeUI.js是个独立的文件,需要把这个文件放到一个目录下,然后在页面头部引入,如:

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

报告相同问题?

悬赏问题

  • ¥15 DIFY API Endpoint 问题。
  • ¥20 sub地址DHCP问题
  • ¥15 delta降尺度计算的一些细节,有偿
  • ¥15 Arduino红外遥控代码有问题
  • ¥15 数值计算离散正交多项式
  • ¥30 数值计算均差系数编程
  • ¥15 redis-full-check比较 两个集群的数据出错
  • ¥15 Matlab编程问题
  • ¥15 训练的多模态特征融合模型准确度很低怎么办
  • ¥15 kylin启动报错log4j类冲突