xiaoliaolcy 2009-04-19 21:00
浏览 311
已采纳

Ext中组件加载问题

在使用Ext的时候,我在一个js文件定义了一个form表单组件,在另一个js文件中通过组件的id来获得组件(Ext.Cmp())在ie7下能够获得组件,但是在ie6和ff3下都不能找到这个组件,错误提示这个组件未定义.
通过我自己的测试:
Ext.ComponentMgr.all.each(function(r){alert(r.id)}) 发现定义的form表单在ie6和ff下都没有被加载.
在定义form表单的js文件里面我做的测试

alert("aa");
var form = new Ext.FormPanel({
...
});
alert("bb");

alert("aa")执行了的,但是alert("bb");未执行
请问这个是怎么回事?

[b]问题补充:[/b]
是我写错了,是用的Ext.getCmp();
[b]问题补充:[/b]
js代码:

第一次用Ext ,不足之处请指教

//用户痕迹统计树形菜单
var statisticsTree = new Ext.tree.TreePanel({
id:'statisticsTree',
frame:false,
border:false,
autoScroll:true,
enableDD:false,//是否支持拖拽效果
containerScroll: true,//是否支持滚动条
split:true,
rootVisible:false,//是否显示跟节点
//collapseMode:'mini',//在分割线处出现按钮
collapsible: true,
margins:'0 0 5 5',
loader:new Ext.tree.TreeLoader({

dataUrl:'js/extjs/statisticsTree.json'

})
});
var statisticsRoot = new Ext.tree.AsyncTreeNode({
text:'统计',
draggable:false,
id:'statisticsRoot'
});
statisticsTree.setRootNode(statisticsRoot);

//ippv统计
var ippv_ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({

//url:'/platform/management/statistics/statisticsIpPv.htm',

method:'post'

}),
autoLoad:false,
remoteSort:false, //服务器端排序
reader: new Ext.data.JsonReader({root:'list',totalProperty:'pagination.count'}, [
{name: '_date'},
{name: 'visitorquantity',type:'int'},
{name: 'ipquantity',type:'int'},
{name: 'pvquantity',type:'float'}
])
});
ippv_ds.load({params:{'pagination.begin':0,'pagination.pageSize':20}});
var sm=new Ext.grid.CheckboxSelectionModel();//表格复选列
var ippv_cm = new Ext.grid.ColumnModel([
{header:'日期',dataIndex:'_date',renderer: function(value){
if(value!=null&&value.length>0){
var d = value.split('T');
return d[0];

}
return value;
}},
{header:'访客数',dataIndex:'visitorquantity'},
{header:'独立IP数',dataIndex:'ipquantity'},
{header:'PV',dataIndex:'pvquantity'}
]);
ippv_cm.defaultSortable = true;

var ippv_form = new Ext.FormPanel({
    id:'ippv_form',
    border: false,
    labelAlign:'right',
    region:'north',
    height:80,
    frame:true,
    items:[new Ext.form.FieldSet({
        title:'查询',
        columnWidth: 1,
        layout: 'column',
        border: true,
        anchor:'50%',
        labelWidth: 50,
        items:[{
            columnWidth:.4,
            layout: 'form',
            border:false,
            items: [{
                xtype:'datefield',
                fieldLabel: '日期:从',
                name: 'beginDate1',
                format:'Y-m-d',
                id:'beginDate1',
                anchor: '90%'
            }]
        },{
            columnWidth:.4,
            layout: 'form',
            border:false,
            items: [{
                xtype:'datefield',
                fieldLabel: '到',
                name: 'endDate1',
                format:'Y-m-d',
                id:'endDate1',
                anchor:'90%'
            }]
        },{
            columnWidth:.2,
            layout: 'form',
            border:false,
            items: [{
                xtype:'button',
                text:'查询',
                handler: function(){
                    var beginDate = document.getElementById('beginDate1').value;
                    var endDate = document.getElementById('endDate1').value;
                    var url = "/platform/management/statistics/statisticsIpPv.htm?beginDate="+beginDate+"&endDate="+endDate;
                    ippv_ds.proxy = new Ext.data.HttpProxy({
                        url:url,   
                        method:'post'  
                    });
                    ippv_ds.reload();
                    ippv_grid.reconfigure(ippv_ds,ippv_cm);
                }
            }]
        }]
    })]
});
var ippv_grid = new Ext.grid.GridPanel({
    id: 'ippv_grid',
    region:'center',
    loadMask:true,
    ds: ippv_ds,
    cm: ippv_cm,
    height:500,
    layout:'fit',
    frame:true, 
    bbar: new Ext.PagingToolbar({
        pageSize: 20,
        store: ippv_ds,
        paramNames:{start: 'pagination.begin', limit: 'pagination.pageSize'},
        displayInfo: true,
        displayMsg: '显示第 {0} 条到 {1} 条记录,一共 {2} 条',
        emptyMsg: "没有记录"
    })       
});

//联盟-搜索引擎统计
var union_search_ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({

//url:'/platform/management/statistics/statisticsFrom.htm',

method:'post'

}),
remoteSort:true, //服务器端排序
reader: new Ext.data.JsonReader({root:'list',totalProperty:'pagination.count'}, [
{name: '_from'},
{name: 'request_quantity',type:'int'},
{name: 'average_request_page_quantity',type:'float'},
{name: 'bounce_rate',type:'float'},
{name: 'register_visitor',type:'int'},
{name: 'registration_rate',type:'float'},
{name: 'order_generation_quantity',type:'int'},
{name: 'listprice',type:'float'},
{name: 'visitor_back_quantity',type:'int'},
{name: 'visitor_quantity',type:'int'},
{name: 'average_back_quantity',type:'float'}
])
});
union_search_ds.load({params:{'pagination.begin':0,'pagination.pageSize':20}});
var union_search_cm = new Ext.grid.ColumnModel([
{header:'来源地',dataIndex:'_from'},
{header:'访问量',dataIndex:'request_quantity'},
{header:'平均访问页面',dataIndex:'average_request_page_quantity'},
{header:'跳出率',dataIndex:'bounce_rate'},
{header:'注册率',dataIndex:'registration_rate'},
{header:'注册人数',dataIndex:'register_visitor'},
{header:'下单人数',dataIndex:'order_generation_quantity'},
{header:'销售码洋',dataIndex:'listprice'},
{header:'回访客数量',dataIndex:'visitor_back_quantity'},
{header:'访客数量',dataIndex:'visitor_quantity'},
{header:'平均回访次数',dataIndex:'average_back_quantity'}
]);
union_search_cm.defaultSortable = true;

var union_search_form = new Ext.FormPanel({
    id:'union_search_form',
    border: false,
    labelAlign:'right',
    region:'north',
    height:80,
    frame:true,
    items:[new Ext.form.FieldSet({
    title:'查询',
    columnWidth: 1,
    layout: 'column',
    border: true,
    anchor:'50%',
    labelWidth: 50,
    items:[{
        columnWidth:.4,
        layout: 'form',
        border:false,
        items: [{
            xtype:'datefield',
            fieldLabel: '日期:从',
            name: 'beginDate2',
            format:'Y-m-d',
            id:'beginDate2',
            anchor: '90%'
        }]
    },{
        columnWidth:.4,
        layout: 'form',
        border:false,
        items: [{
            xtype:'datefield',
            fieldLabel: '到',
            name: 'endDate2',
            format:'Y-m-d',
            id:'endDate2',
            anchor:'90%'
        }]
    },{
        columnWidth:.2,
        layout: 'form',
        border:false,
        items: [{
            xtype:'button',
            text:'查询',
            handler: function(){
                var beginDate = document.getElementById('beginDate2').value;
                var endDate = document.getElementById('endDate2').value;
                var url = "/platform/management/statistics/statisticsFrom.htm?beginDate="+beginDate+"&endDate="+endDate;
                union_search_ds.proxy = new Ext.data.HttpProxy({
                    url:url,   
                    method:'post'  
                });
                union_search_ds.reload();
                union_search_grid.reconfigure(union_search_ds,union_search_cm);
            }
        }]
    }]
})]
});
var union_search_grid = new Ext.grid.GridPanel({
    id: 'union_search_grid',
    region:'center',
    loadMask:true,
    ds: union_search_ds,
    cm: union_search_cm,
    height:500,
    layout:'fit',
    frame:true, 
    bbar: new Ext.PagingToolbar({
        pageSize: 20,
        store: union_search_ds,
        paramNames:{start: 'pagination.begin', limit: 'pagination.pageSize'},
        displayInfo: true,
        displayMsg: '显示第 {0} 条到 {1} 条记录,一共 {2} 条',
        emptyMsg: "没有记录"
    })       
});

//搜索引擎关键字统计

var keyword_ds = new Ext.data.Store({
    proxy: new Ext.data.HttpProxy({   
        //url:'/platform/management/statistics/statisticsKeyword.htm',   
        method:'post'  
    }), 
    autoLoad:false,
    remoteSort:true,  //服务器端排序
    reader: new Ext.data.JsonReader({root:'list',totalProperty:'pagination.count'}, [
        {name: '_from'},
        {name: 'keyword',type:'string'},
        {name: 'search_quantity',type:'int'}
        ])
});
keyword_ds.load({params:{'pagination.begin':0,'pagination.pageSize':20}}); 
var keyword_cm = new Ext.grid.ColumnModel([
    {header:'来源地',dataIndex:'_from'},
    {header:'关键字',dataIndex:'keyword'},
    {header:'搜索次数',dataIndex:'search_quantity'}
]);
keyword_cm.defaultSortable = true;
var keyword_form = new Ext.FormPanel({
    id:'keyword_form',
    border: false,
    labelAlign:'right',
    region:'north',
    height:80,
    frame:true,
    items:[new Ext.form.FieldSet({
    title:'查询',
    columnWidth: 1,
    layout: 'column',
    border: true,
    anchor:'50%',
    labelWidth: 50,
    items:[{
        columnWidth:.4,
        layout: 'form',
        border:false,
        items: [{
            xtype:'datefield',
            fieldLabel: '日期:从',
            name: 'beginDate3',
            format:'Y-m-d',
            id:'beginDate3',
            anchor: '90%'
        }]
    },{
        columnWidth:.4,
        layout: 'form',
        border:false,
        items: [{
            xtype:'datefield',
            fieldLabel: '到',
            name: 'endDate3',
            format:'Y-m-d',
            id:'endDate3',
            anchor:'90%'
        }]
    },{
        columnWidth:.2,
        layout: 'form',
        border:false,
        items: [{
            xtype:'button',
            text:'查询',
            handler: function(){
                var beginDate = document.getElementById('beginDate3').value;
                var endDate = document.getElementById('endDate3').value;
                var url = "/platform/management/statistics/statisticsKeyword.htm?beginDate="+beginDate+"&endDate="+endDate;
                keyword_ds.proxy = new Ext.data.HttpProxy({
                    url:url,   
                    method:'post'  
                });
                keyword_ds.reload();
                keyword_grid.reconfigure(keyword_ds,keyword_cm);
            }
        }]
    }]
})]
});
var keyword_grid = new Ext.grid.GridPanel({
    id: 'keyword_grid',
    ds: keyword_ds,
    cm: keyword_cm,
    region:'center',
    loadMask:true,
    height:500,
    layout:'fit',
    frame:true,
    bbar: new Ext.PagingToolbar({
        pageSize: 20,
        store: keyword_ds,
        paramNames:{start: 'pagination.begin', limit: 'pagination.pageSize'},
        displayInfo: true,
        displayMsg: '显示第 {0} 条到 {1} 条记录,一共 {2} 条',
        emptyMsg: "没有记录"
    })       
});

// 页面访问数量统计

var access_quantity_ds = new Ext.data.Store({
    proxy: new Ext.data.HttpProxy({   
        //url:'/platform/management/statistics/statisticsPage.htm',   
        method:'post'  
    }), 
    autoLoad:false,
    remoteSort:true,  //服务器端排序
    reader: new Ext.data.JsonReader({root:'list',totalProperty:'pagination.count'}, [
        {name: 'page'},
        {name: 'quantity',type:'int'}
        ])
});
access_quantity_ds.load({params:{'pagination.begin':0,'pagination.pageSize':20}}); 
var access_quantity_cm = new Ext.grid.ColumnModel([
    {header:'页面',dataIndex:'page'},
    {header:'访问数量',dataIndex:'quantity'}
]);
access_quantity_cm.defaultSortable = true;
var access_quantity_form = new Ext.FormPanel({
    id:'access_quantity_form',
    border: false,
    labelAlign:'right',
    region:'north',
    height:80,
    frame:true,
    items:[new Ext.form.FieldSet({
    title:'查询',
    columnWidth: 1,
    layout: 'column',
    border: true,
    anchor:'50%',
    labelWidth: 50,
    items:[{
        columnWidth:.4,
        layout: 'form',
        border:false,
        items: [{
            xtype:'datefield',
            fieldLabel: '日期:从',
            name: 'beginDate4',
            format:'Y-m-d',
            id:'beginDate4',
            anchor: '90%'
        }]
    },{
        columnWidth:.4,
        layout: 'form',
        border:false,
        items: [{
            xtype:'datefield',
            fieldLabel: '到',
            name: 'endDate4',
            format:'Y-m-d',
            id:'endDate4',
            anchor:'90%'
        }]
    },{
        columnWidth:.2,
        layout: 'form',
        border:false,
        items: [{
            xtype:'button',
            text:'查询',
            handler: function(){
                var beginDate = document.getElementById('beginDate4').value;
                var endDate = document.getElementById('endDate4').value;
                var url = "/platform/management/statistics/statisticsPage.htm?beginDate="+beginDate+"&endDate="+endDate;
                access_quantity_ds.proxy = new Ext.data.HttpProxy({
                    url:url,   
                    method:'post'  
                });
                access_quantity_ds.reload();
                access_quantity_grid.reconfigure(access_quantity_ds,access_quantity_cm);
            }
        }]
    }]
})]
});
var access_quantity_grid = new Ext.grid.GridPanel({
    id: 'access_quantity_grid',
    ds: access_quantity_ds,
    cm: access_quantity_cm,
    region:'center',
    loadMask:true,
    height:500,
    layout:'fit',
    frame:true,
    bbar: new Ext.PagingToolbar({
        pageSize: 20,
        store: access_quantity_ds,
        paramNames:{start: 'pagination.begin', limit: 'pagination.pageSize'},
        displayInfo: true,
        displayMsg: '显示第 {0} 条到 {1} 条记录,一共 {2} 条',
        emptyMsg: "没有记录"
    })     
});

//各来源地销售统计

var from_ds = new Ext.data.Store({
    proxy: new Ext.data.HttpProxy({   
        //url:'/platform/management/statistics/statisticsCommodity.htm',   
        method:'post'  
    }), 
    autoLoad:false,
    remoteSort:true,  //服务器端排序
    reader: new Ext.data.JsonReader({root:'list',totalProperty:'pagination.count'}, [
        {name: '_from'},
        {name: 'commodity.name',type:'string'},
        {name: 's',type:'int'}
        ])
});
from_ds.load({params:{'pagination.begin':0,'pagination.pageSize':20}}); 
var from_cm = new Ext.grid.ColumnModel([
    {header:'来源地',dataIndex:'_from'},
    {header:'商品名',dataIndex:'commodity.name',sortable:false},
    {header:'销售数量',dataIndex:'s'}
]);
from_cm.defaultSortable = true;

var from_form = new Ext.FormPanel({
    id:'from_form',
    border: false,
    labelAlign:'right',
    region:'north',
    height:140,
    frame:true,
    items:[new Ext.form.FieldSet({
    title:'查询',
    columnWidth: 1,
    layout: 'column',
    border: true,
    anchor:'50%',
    labelWidth: 60,
    items:[{
        columnWidth:.4,
        layout: 'form',
        border:false,
            items: [{
                width:130,
                xtype:'datefield',
                fieldLabel: '日期,从',
                name: 'beginDate5',
                format:'Y-m-d',
                id:'beginDate5'
            }, {
                width:130,
                xtype:'textfield',
                fieldLabel: '来源地',
                allowBlank: false,
                blankText:'来源地不能为空',                    
                name: 'from',
                id:'from'
            }]
        },{
            columnWidth:.4,
            layout: 'form',
            items: [{
                width:130,
                xtype:'datefield',
                fieldLabel: '到',
                format:'Y-m-d',
                name: 'endDate5',
                id:'endDate5'
            },{
                width:130,
                xtype:'numberfield',
                fieldLabel: '商品编号',
                name: 'commodityId',
                id:'commodityId'
            }]
    },{
        columnWidth:.4,
        layout: 'form', bodyStyle:'padding:20px 5px 0',
        border:false,
        items: [{
            xtype:'button',
            text:'查询',
            handler: function(){
                if (!from_form.getForm().isValid()) {
                    return;
                }
            var beginDate = document.getElementById('beginDate5').value;
            var endDate = document.getElementById('endDate5').value;
            var from = from_form.getForm().findField("from").getValue();
            var commodityId = from_form.getForm().findField("commodityId").getValue();
            var url = "/platform/management/statistics/statisticsCommodity.htm?beginDate="+beginDate+"&endDate="+endDate+"&from="+from+"&commodityId="+commodityId;
                from_ds.proxy = new Ext.data.HttpProxy({
                    url:url,   
                    method:'post'  
                });
                from_ds.reload();
                from_grid.reconfigure(from_ds,from_cm);
            }
        }]
    }]
})]
});
var from_grid = new Ext.grid.GridPanel({
    id: 'from_grid',
    ds: from_ds,
    cm: from_cm,
    region:'center',
    loadMask:true,
    layout:'fit',
    height:500,
    frame:true,
    bbar: new Ext.PagingToolbar({
        pageSize: 20,
        store: from_ds,
        paramNames:{start: 'pagination.begin', limit: 'pagination.pageSize'},
        displayInfo: true,
        displayMsg: '显示第 {0} 条到 {1} 条记录,一共 {2} 条',
        emptyMsg: "没有记录"
    })       
});

[b]问题补充:[/b]
2个alert()之间的代码,是user_trace.statistics.js 里面ippv_form
[b]问题补充:[/b]
页面太简单了嘛,直接引用2个js文件就可以了
[b]问题补充:[/b]
请问怎么才是js封装到位了,给个例子嘛

  • 写回答

9条回答 默认 最新

  • zhoujuan520 2009-04-21 17:06
    关注

    id这个东西是要尽量避免的.并不是你的就一定要getCmp ,你也同样可以用组件的items来访问的,具体去翻api吧.我也不想多说了.累呀,感觉回答问题的比提问的还要热情!

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

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题