GridPanel中的动态Tips

function showPanelTips(gridPanel) { var view = gridPanel.getView(); for (var rowIndex = 0; rowIndex < gridPanel.getStore().getCount(); rowIndex++) { var record = gridPanel.getStore().getAt(rowIndex);//此处根据下标获得某行的数据 var rows = view.getRow(rowIndex);//根据那个下标获得这个row var dom = rows.getElementsByTagName('tr')[0];//此处通过firebug获知里面其实是一个tr标签 rows.getElementsByTagName('td')[2]; var id = Ext.id();//通过此函数生成一个随即的ID dom.id = id;//将此ID赋值给我们获得的那一个dom var eid = record.get('eid');//在Record中找到后台传过来的ID(用于和后台交互) var tip = new Ext.ToolTip({ target : id, layout : 'form', autoLoad : { url : 'basicEmployees.do?method=findInfoByEid&eid=' + eid,//和Struts里的Action交互,在Action中重定向到另外一个页面.在那个页面里通过EL表达式就可以显示我们想要的数据 method : 'GET' }, height : 250, width : 350, dismissDelay : 15000, trackMouse : true , listeners: { beforeshow: function() { //隐藏其他项 Ext.select('div.x-tip').each(function(i){ i.hide(); // i.on("mouseout",function(){ // Ext.Msg.alert('提示消息框','测试Button组件：mouseout事件！'); // }); }); Ext.select('div.x-shadow').each(function(i){ i.hide(); }); } }); } };

 

 

<script type="text/javascript">

Ext.onReady(function(){

 <%=GridPanel1.ClientID %>.store.on('load', function() {  
 
   showPanelTips(<%=GridPanel1.ClientID %>);   });
 
 }); 

</script>

 

 

 

http://atgfss.javaeye.com/blog/362137

 

http://www.javaeye.com/topic/344936

 

 

 

 

//表格Cell Tooltip

var qtipTpl = new Ext.XTemplate(
    '<h3>Phones:</h3>',
    '<tpl for=".">',
    '<div><i>{AL_Name}:</i> {AL_Contact}</div>',
    '</tpl>'
);

 

var renderer = function(data, metadata, record, rowIndex, columnIndex, store) {

        var data = record.data;
        var qtip = qtipTpl.apply(data.AL_Name);
        metadata.attr = 'ext:qtitle="' + data.A_Name + '"' + ' ext:qtip="' + qtip + '"';
        return data;
    }; 

 

 

 

 

 

 

 

Ajax tooltip
http://www.java2s.com/Code/JavaScript/Ext-JS/Ajaxtooltip.htm
http://www.extjs.com/forum/showthread.php?19868-Grid-Cell-Tooltip&p=112125

http://developer.51cto.com/art/200907/133445.htm

GridPanel中的动态Tips
http://atgfss.javaeye.com/blog/362137

 

http://www.javaeye.com/topic/344936

 

 

ExtJS Grid Tooltip的3+1种实现方式总结

http://developer.51cto.com/art/200907/133445.htm