extjs中在GridPanel上添加一个搜索框 （文本框+按钮）怎么实现啊。。

直接配置到工具条tbar里就行了：

var

grid

=

new

Ext.grid.GridPanel({

id:

"grid1",

title:

"GridPanel实例",

renderTo:

"div1",

width:

500,

height:

300,

frame:

true,

tbar:

[{xtype:'label',text:'请输入关键词：'},{xtype:'textfield',id:'KeyWord'},{text:'搜索',handler:function(){alert("搜索")}}

],

。。。。。//其它配置项

})

给你个例子

Ext.create('Ext.grid.Panel', {

title: 'Action Column Demo',

store: Ext.data.StoreManager.lookup('employeeStore'),

columns: [

{text: 'First Name', dataIndex:'firstname'},

{text: 'Last Name', dataIndex:'lastname'},

{

xtype:'actioncolumn',//这里就是放置按钮的地方

width:50,

items: [{

icon: 'extjs/examples/shared/icons/fam/cog_edit.png', // Use a URL in the icon config

tooltip: 'Edit',

handler: function(grid, rowIndex, colIndex) {

var rec = grid.getStore().getAt(rowIndex)

alert("Edit " + rec.get('firstname'))

}

},{

icon: 'extjs/examples/restful/images/delete.png',

tooltip: 'Delete',

handler: function(grid, rowIndex, colIndex) {

var rec = grid.getStore().getAt(rowIndex)

alert("Terminate " + rec.get('firstname'))

}

}]

}

],

width: 250,

renderTo: Ext.getBody()

})

在new的时候错误,是"Ext.panel.Panel"不是"Ext.Panel"个人建议不使用new使用 Ext.create()

代码如下:

var _panel = Ext.create('Ext.panel.Panel',{

//此处省略代码

})

//现在你应该不会错了

---