在Ext的GridPanel中添加鼠標懸停的效果

我們在進行前段開發時，通常會出現這樣的問題：就是Ext的Grid每列可顯示的字數不是很多，在爲了佈局漂亮而不改變每列寬度的前提下，我們可以給需要顯示的列添加一個鼠標的懸停事件，添加一個QuickTips來顯示詳細的內容

renderer: function(value, metadata, record, rowIndex, columnIndex, store) {
                metadata.attr = 'ext:qtip="標籤詳細信息:<br/>' + value +'"';
                return value;
               }

這就是具體的實現代碼，很簡單吧 ！其實就是給這一列加上renderer。

函數中的value，就是我們獲取到的值，所以我們只是添加了qtip，這樣一來，grid裏面顯示的是不完全的結果，把鼠標放在上面之後就顯示出了詳細的內容！

對了，不要忘了，還需要加上這句話

Ext.QuickTips.init();

來顯示qtip

給出ColumnModel中該列的定義

{
		id : 'myTag',
		header : '標籤',
		align : 'center',
		dataIndex : 'tag',
		sortable: true,
		renderer: function(value, metadata, record, rowIndex, columnIndex, store) {
                metadata.attr = 'ext:qtip="標籤詳細信息:<br/>' + value +'"';
                return value;
               }
	}