日期:2014-05-16  浏览次数:20272 次

ExtJS4中在grid panel的每一行显示qtip
原文地址:

http://existdissolve.com/2011/07/adding-qtips-to-gridpanel-rows-in-extjs-4-0/

解释一下:

在grid panel里columns属性下,为需要显示qtip的column对象加一个renderer属性,它是一个函数,如下:

this.columns = [
{
  text: “Bookmark”,
  dataIndex: “title”,
  flex: 1,

  renderer: function(value,metaData,record,colIndex,store,view) {
      metaData.tdAttr = ‘data-qtip=”‘ + value + ‘”‘;
      return value;
  }


}]

作者提到,需要注意metaData这个参数,它的属性tdAttr是新版本的Ext才有的,对于旧版本的Ext,则是attr,还有就是data-qtip这里也一样,旧版本的Ext则是ext:qtip。

最后说明一下其中的 value 就是要显示qtip的字符串,可以自己定制,这个函数中有个叫record的参数,里面有存放该行的记录,详情可用console.log(record)打印出来。