根据学习，了解了一些ext的知识，
显示出一个grid的时候，高手（牛逼人物）把ext写了个特效，就是当鼠标移到grid的记录的时候单行和双行颜色效果不一样，经过老师的讲解，在要修改ext内部的源码就可以实现那种效果，根据老师的讲解，现在自己也做了一个特效，就是将鼠标移到grid的记录时候，会弹出一个window窗体，并且窗体带一个panel当鼠标移到记录时，会将记录的值取出来，将值赋值给window里面的panel的表单去，并且还有自动收缩和自动扩展的功能，
唯一不足之处就是“本想让它鼠标移到grid记录时候弹出一个窗口，想让它停滞几秒让它关闭了！但是种种原因没有办法实现 1.我用close关闭window 但是鼠标再次移到记录的时候window就再也打不开了 2.用hide来隐藏window 但是你鼠标始终停滞在记录上，它一旦隐藏了马上就又出来了”求高手们给个答案。。。。。。
此代码直接拷贝是不能用的，因为grid的数据是用dwr去后台取出数据来！
大家可以自己定义grid在将弹出window的代码模仿写写 尝试解决上面的问题...
teacher.initListGrid = function(){
var colMap ={
id:'id',
columns:[
{id: "id",header: "<fmt:messagekey='teacher.id' />", hidden:true,hideable:false, dataIndex: 'id'},
{header: "<fmt:message key='teacher.name' />", width: 100, sortable: true, locked:false, dataIndex: 'name'},
{header: "<fmt:message key='teacher.sex' />", width: 100, sortable: true, locked:false, dataIndex: 'sex'},
{header: "<fmt:message key='teacher.addres' />", width: 100, sortable: true, locked:false, dataIndex: 'addres'},
header: "<fmt:message key='teacher.dataState' />", hidden:true ,width: 100, sortable: true, locked:false, dataIndex: 'dataState'} ]};//IE DELETE
var grid = teacher.listGrid = new Ext.grid.GridPanel({
colMap: colMap,
loadMask: {msg:'<fmt:message key="loadData.waitmsg"/>'},
stripeRows: true,
viewConfig: {
forceFit:true
},
showRowNumber:true,
border:false,
dwrFun:teacherManager.getTeachersByDwr,
showPagebar:true,
singleSelect :true,
//鼠标移到grid的数据时显示窗体
afterRender : function(){
this.on('mouseover',this.rowMouseOver,this,{buffer:500});},
rowMouseOver : function(e,t){
var view = this.view
var row = view.findRowIndex(t);
if(row!== false){
if(!this.win){
this.win = new Ext.Window({
id:'goods.win',
title : '内容',
width : 250,
autoHeight :true,
layout : 'fit',
border : false,
closeAction : 'hide',
items : new Ext.FormPanel({
id : 'form-panel',
frame : true,
autoHeight : true,
labelWidth : 80,
defaults : {
width : 100,
xtype : 'textfield'},
items : [{fieldLabel : 'id',name : 'id',readOnly:true,allowBlank:false},
{xtype:'box',autoEl:{style:'height:10px'}},
//将两个连接在一起的textfield分开
{fieldLabel : 'name',name : 'name',readOnly:true,allowBlank:false},
{xtype:'box',autoEl:{style:'height:10px'}},
{fieldLabel : 'sex',name : 'sex',readOnly:true,allowBlank:false},
{xtype:'box',autoEl:{style:'height:10px'}},
{fieldLabel : 'addres',name : 'addres',readOnly:true,allowBlank:false},
{xtype:'box',autoEl:{style:'height:10px'}},
{fieldLabel : 'dataState',name : 'dataState',readOnly:true,allowBlank:false}]
}),
//收缩小图标 以及实习的功能
tools : [{
id :'pin',
qtip : '禁用自动收缩',
hidden : true,
handler :
function(event, el, panel){
removeWinEvent ("goods.win");
Ext.getDom(panel.tools['pin'].id).style.display = "none";
Ext.getDom(panel.tools['unpin'].id).style.display = "block";
}
}, {
id :'unpin',
qtip : '启动自动收缩',
hidden : true,
handler :
function(event, el, panel){
setWinEvent("goods.win");
Ext.getDom(panel.tools['pin'].id).style.display = "block";
Ext.getDom(panel.tools['unpin'].id).style.display = "none";
}
}],
listeners : {
'beforeshow' : function(cmp) {
setWinEvent("goods.win");
}
}
});
//当启动自动收缩的时候的事件 就是鼠标移过去的时候就显示 移开的时候就收缩
function setWinEvent(winId) {
var winPanel = Ext.getCmp(winId);
Ext.get(winId).on('mouseover', function() {
if (winPanel.collapsed) {
winPanel.expand();
Ext.getDom(winPanel.tools['pin'].id).style.display = "block";
Ext.getDom(winPanel.tools['unpin'].id).style.display = "none";
}
});
Ext.get(winId).on('mouseleave', function() {
if (!winPanel.collapsed) {
winPanel.collapse();
Ext.getDom(winPanel.tools['pin'].id).style.display = "none";
Ext.getDom(winPanel.tools['unpin'].id).style.display = "none";
}
});
}
//移除事件
function removeWinEvent(winId){
Ext.get(winId).removeAllListeners();
};
}
//显示窗体的位置
this.win.setPosition(e.getXY());
//this.win.setPosition(2,200);
this.win.show();
//过2秒显示的窗体自动关闭
//this.win.close.defer(2000,this.win);
/*
//新建一个任务
var task = {
run: function(){
Ext.getCmp('goods.win').hide();
},
interval: 100 //秒 刷新一次
}
var runner = new Ext.util.TaskRunner();
runner.start(task);
*/
/*
this.win.on("beforedestroy", function(obj) {
Ext.MessageBox.alert("信息", "想关闭我，那是不可能的"),
obj.show();
return false;
},this,{delay:2000});
*/
this.win.toFront();
this.fillData(this.getStore().getAt(row));
}
},
beforeDestroy : function(){
Ext.destroy(this.win);//摧毁win的窗体
},
//给窗体的form表单填入数据
fillData : function(record){
var form = Ext.getCmp('form-panel').getForm();
form.setValues(record.data);
}
});
}
代码在此。。。请牛人们多多指教...晚辈献丑了...