初学Extjs有关问题？TBar中的tooltip显示不出来

初学Extjs问题？TBar中的tooltip显示不出来？
为什么tooltip无效，显示不出来？没搞明白！呵呵，请大家指点下？

Ext.onReady(function(){

  // create the Data Store
  var store = new Ext.data.JsonStore({
  root: 'Products',
  totalProperty: 'totalCount',
  idProperty: 'ProductID',
  remoteSort: true,
//sortInfo:{field: 'ProductID', direction: 'ASC'}  
  fields: [
  {name: 'ProductID', type: 'int'} , 'ProductName', 'QuantityPerUnit'
  ],

  // load using script tags for cross domain, if the data in on the same domain as
  // this page, an HttpProxy would be better
  proxy: new Ext.data.HttpProxy({
  //url: 'http://extjs.com/forum/topics-browse-remote.php'  
  url: 'http://localhost/Asp/ext-3.2.1/MyTools/HttpProxy/GetNorth.asp'
  })
  });
   

  store.setDefaultSort('ProductID', 'asc');


  // pluggable renders
  function renderTopic(value, p, record){
  return String.format(
  '<b><a href="http://extjs.com/forum/showthread.php?t={2}" target="_blank">{0}</a></b><a href="http://extjs.com/forum/forumdisplay.php?f={3}" target="_blank">{1} Forum</a>',
  value, record.data.forumtitle, record.id, record.data.forumid);
  }
  function renderLast(value, p, r){
  return String.format('{0}<br/>by {1}', value.dateFormat('M j, Y, g:i a'), r.data['lastposter']);
  }


var sm2 = new Ext.grid.CheckboxSelectionModel({
  listeners: {
  // On selection change, set enabled state of the removeButton
  // which was placed into the GridPanel using the ref config
  selectionchange: function(sm) {
  if (sm.getCount()) {
  grid.removeButton.enable();
  } else {
  grid.removeButton.disable();
  }
  }
  }
  });


  var grid = new Ext.grid.GridPanel({

  // inline toolbars
  tbar:[{
  text:'新增',
  tooltip:'新增记录',
  iconCls:'add'
  }, '-', {
  text:'修改',
  tooltip:'修改记录',
  iconCls:'option'
  },'-',{
  text:'删除',
  tooltip:'删除记录',
  iconCls:'remove',

  // Place a reference in the GridPanel
  ref: '../removeButton',
  disabled: true  
  },'-',{
  xtype:'textfield',
  id:'KeyWord',
  width:100,
  title:'请输入关键词'
  },'-',{
  xtype:'combo',
  store: store,  
  fieldLabel: '请选择分类',  
  valueField :"ProductID",  
  displayField: "ProductID",  
  mode: 'local',  
  forceSelection: true,//必须选择一项  
  emptyText:'请选择分类',//默认值  
  hiddenName:'ProductID',//hiddenName才是提交到后台的input的name  
  editable: false,//不允许输入  
  triggerAction: 'all',//因为这个下拉是只能选择的，所以一定要设置属性triggerAction为all，不然当你选择了某个选项后，你的下拉将只会出现匹配选项值文本的选择项，其它选择项是不会再显示了，这样你就不能更改其它选项了。  
  //allowBlank:false,//该选项值不能为空  

  id : 'SelContent',  
  width:100,  
  name: 'parent',  
  listeners:{  
  select : function(combo, record,index){
  store.proxy= new Ext.data.HttpProxy({url: 'http://localhost/Asp/ext-3.2.1/MyTools/HttpProxy/GetNorth.asp?SelContent=' + combo.value});  
  store.load({params:{start:0, limit:15}});  
  }  
  }  
  },'-',{
  text:'搜索',
  handler : function() {
  var KeyWord= document.getElementById("KeyWord").value;  
  var SelContent= document.getElementById("SelContent").value;  
// 定义进度条
//grid.body.mask('正在查询,请稍等......');
//alert('http://localhost/Asp/ext-3.2.1/MyTools/HttpProxy/GetNorth.asp?KeyWord=' + KeyWord + '&SelContent=' + SelContent);
 
store.proxy= new Ext.data.HttpProxy({url: 'http://localhost/Asp/ext-3.2.1/MyTools/HttpProxy/GetNorth.asp?KeyWord=' + KeyWord + '&SelContent=' + SelContent});  
  store.load({params:{start:0, limit:15}});
}
  }],

  width:700,
  height:500,
  title:'列表显示',
  store: store,
  trackMouseOver:true,
  disableSelection:true,
  loadMask: true,
sm: sm2,
  // grid columns
  columns:[
  new Ext.grid.RowNumberer(),
  sm2,
  {  
  id: 'RowID', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
  header: "ProductID",
  dataIndex: 'ProductID',
  width: 60,
  //renderer: renderTopic,
  align: 'center',
  sortable: true
  },{
  header: "ProductName",
  dataIndex: 'ProductName',
  width: 150,
align: 'center',
  sortable: true
  },{
  header: "QuantityPerUnit",
  dataIndex: 'QuantityPerUnit',
  width: 250,
  align: 'center',
  sortable: true
  }],

  // customize view config
  viewConfig: {
  forceFit:true,
  enableRowBody:true,
  showPreview:false,
  getRowClass : function(record, rowIndex, p, store){
  if(this.showPreview){
  p.body = '<p>'+record.data.excerpt+'</p>';
  return 'x-grid3-row-expanded';
  }
  return 'x-grid3-row-collapsed';
  }
  },

  // paging bar on the bottom
  bbar: new Ext.PagingToolbar({
  pageSize: 15,
  store: store,
  displayInfo : true,
beforePageText:"第&nbsp;",
afterPageText:"&nbsp;页/共 {0} 页",
firstText:"首页",
prevText:"上一页",
nextText:"下一页",
lastText:"尾页",
refreshText:"刷新",
displayMsg : "当前显示记录从 {0} - {1} 总共 {2} 条记录",
emptyMsg : "没有相关记录!"//,
  /* items:[
  '-', {
  pressed: true,
  enableToggle:true,

  text: 'Show Preview',
  cls: 'x-btn-text-icon details',
  toggleHandler: function(btn, pressed){
  var view = grid.getView();
  view.showPreview = pressed;
  view.refresh();
  }
  }]*/
  })
  });

  // render it
  grid.render('topic-grid');

  // trigger the data store load
  store.load({params:{start:0, limit:15}});
});

[/code]

[解决办法]
grid.render('topic-grid');
的意思是，把这个GRID添加进ID为'topic-grid'的容器里。
'topic-grid'可能是一个DIV，或者其它什么的。
[解决办法]
Ext.QuickTips.init();
代码里加上这句看看
[解决办法]
Ext.QuickTips.init(); 正解

grid 行高度可以去 ext-all.css 中改

CSS code

.x-grid3-row td,.x-grid3-summary-row td{     height:30px;  line-height:30px;  .........}
[解决办法]
楼主的意思是想给一个文本框(xtype='textfield')添加上tooltip吗？如果是的话可以试着在渲染完毕事件中新建一个tooltip对象。这是一个通式。
JScript code
new Ext.ToolTip({    target : documentElement.id,//需要提示的目标dom元素    html : '提示信息',//想要显示的提示信息    trackMouse : true//是否跟随鼠标移动而移动});