我用EXTJS的GRID在页面显示一张表。通过servlet从数据库读取数据并通过servlet实现查询功能。读取数据实现。查询时希望在tbar上添加一些组件,通过servlet查询。我是才开始用EXT。以前写html时用的是表单。我把表单变量放到tbar。没显示。应该是不允许这样放置吧。那应该怎么实现呢? 代码如下:
Ext.onReady(function(){ Ext.QuickTips.init(); var sdt=new Ext.form.DateField({ fieldLabel:'日期', emptyText:'请选择开始日期', format:'Y-m-d', disabledDays:false }); var stime=new Ext.form.TimeField({ fieldLabel:'时间', emptyText:'请选择开始时间', width:100, //minValue:'12:00', // maxValue:'11:00', increment:10 }); var edt=new Ext.form.DateField({ fieldLabel:'日期', emptyText:'请选择结束日期', format:'Y-m-d', disabledDays:false }); var etime=new Ext.form.TimeField({ fieldLabel:'时间', emptyText:'请选择结束时间', width:100, //minValue:'12:00', // maxValue:'11:00', increment:10 }); var atype = new Ext.form.ComboBox({ width:100, fieldLabel : '攻击类型', //UI标签名称 name : 'attackType', //作为form提交时传送的参数 allowBlank : false, //是否允许为空 mode : 'local', //数据模式,local为本地模式, readOnly : true, //是否只读 triggerAction : 'all', //显示所有下列数.必须指定为'all' anchor : '90%', emptyText:'请选择...', store : new Ext.data.SimpleStore({ //填充的数据 fields : ['value', 'type'], data : [['dos', 'dos'], ['scan', 'scan'], ['worm', 'worm']] }), valueField : 'value', //传送的值 displayField : 'type' //UI列表显示的文本 }); var cm=new Ext.grid.ColumnModel([ new Ext.grid.RowNumberer( { header:'NO.', width:30 } ), {header:'timestamp',dataIndex:'timeStamp',width:200,sortable:true}, {header:'attack_type',dataIndex:'attackType',width:150}, {header:'dos',dataIndex:'dos'}, {header:'scan',dataIndex:'scan'}, {header:'worm',dataIndex:'worm'} ]); var ds=new Ext.data.Store({ proxy: new Ext.data.HttpProxy({url:'PreAttackType'}), reader: new Ext.data.JsonReader({ totalProperty:'results', root:'rows' },[ {name:'timeStamp'}, {name:'attackType'}, {name:'dos'}, {name:'scan'}, {name:'worm'} ]) }); var grid=new Ext.grid.GridPanel({ el: 'pre_attack_type', ds:ds, cm:cm, title:"pre_attack_type表", width:800, autoHeight:true, border:true, collapsible:true, frame:true, enableHdMenu:true, footer:true, trackMouseOver:false, disableSelection:true, viewConfig:{ forceFit:true }, loadMask:true, tbar:[ "开始时间:", sdt, stime, "-", "结束时间:", edt, etime, "-", "攻击类型:", atype, "-", { text:"查询", cls:"x-btn-text-icon", style:"margin-left:5", icon:"images/filter.png", handler:this.filterClick, scope:this } ], bbar:new Ext.PagingToolbar({ pageSize:10, store:ds, displayInfo:true, displayMsg:'显示第{0}条到{1}条记录,一共{2}条', emptyMsg:'没有记录' }) }); grid.render(); ds.load({params:{start:0,limit:10}}); })