1.定时刷新下拉框
var data = [[null, '不刷新'], [2000, '10分钟'], [1200000, '20分钟'],
[1800000, '30分钟'], [2400000, '40分钟'], [3000000, '50分钟'],
[3600000, '60分钟']];
var intervalStore = new Ext.data.SimpleStore({
fields : ['name', 'interval'],
data : data
});
var actAutoRefresh = new Ext.form.ComboBox({
fieldLabel : '定时刷新',
name : 'setTime',
store : intervalStore,
mode : 'local',
triggerAction : 'all',
editable : false,
width : 100,
emptyText : '定时刷新',
// enableKeyEvents : true,
valueField : 'name',
displayField : 'interval'
});
function ref() {
grid.store.reload();
}
var timeV;
actAutoRefresh.on("select", function(comboBox) {
if (comboBox.getValue() != null) {
if (tmpTimer != null) {
window.clearInterval(tmpTimer);
}
tmpTimer = window.setInterval(ref, comboBox.getValue());
} else {
window.clearInterval(tmpTimer);
};
});
2.正在加载提示
new Ext.LoadMask(Ext.getBody(), {
store : store,
msg : "正在加载数据,请稍等..."
})
3.在grid的单元格上悬浮提示框
gridToolTip1(grid);
function gridToolTip1(grid) {
if (!grid)
return;
grid.on('render', function(grid) {
try {
var store = grid.getStore(); // Capture the Store.
if (!store)
return;
var view = grid.getView(); // Capture the GridView.
if ((!view) || (!view.mainBody))
return;
var cm = grid.getColumnModel();
if (!cm)
return;
var tip = new Ext.ToolTip({
target : view.mainBody, // The overall target element.
delegate : '.x-grid3-cell-inner', // Each grid row
// causes its own
// seperate show and
// hide.
trackMouse : true, // Moving within the row should not
// hide the tip.
autoHeight : true,
minWidth : 300,
maxWidth : 300,
mouseOffset : [-100, 0],
renderTo : document.body, // Render immediately so
// that tip.body can be
// referenced prior to the
// first show.
listeners : { // Change content dynamically depending
// on which element triggered the show.
beforeshow : function updateTipBody(tip) {
try {
tip.body.dom.innerHTML = '';
if (tip.triggerElement) {
var rowIndex = view
.findRowIndex(tip.triggerElement);
var cellIndex = view
.findCellIndex(tip.triggerElement);
if (((rowIndex == 0) || rowIndex)
&& ((cellIndex == 0) || cellIndex)
&& store) {
var fieldName = cm
.getDataIndex(cellIndex);
if (fieldName) {
if (fieldName.substring(0, 3) != 'TAB')
return false;
var rec = store.getAt(rowIndex);
if (rec) {
var content = rec
.get(fieldName);
if (!content
|| content == '')
return false;
if (content == '0') {
var institute_name = rec
.get("institute_name")
Ext.Ajax.request({
url : linkGetExceptionsText,
params : {
institute_name : institute_name,
jhbm : fieldName
},
success : function(
response,
options) {
var data = Ext
.decode(response.responseText);
tip.body.dom.innerHTML = data.data.exceptionsText;
}
});
return true;
}
}
}
}
}
} catch (e) {
}
return false;
}
}
});
} catch (e) {
}
});
}
//page类里的处理程序
public boolean onLinkGetExceptionsText() {
String institute_name = PageUtils.getLinkParameter(
linkGetExceptionsText, "institute_name", null);
String jhbm = PageUtils.getLinkParameter(linkGetExceptionsText, "jhbm",
null);
String model = "IRC_" + jhbm.substring(4, 6);
DataSource hr_ds0 = DBConnectionPool.getInstance().getDataSource(
"local_irc");
String sql = "select code from BF_BIZ_CODE where name='"
+ institute_name + "'";
List<Map<String, Object>> mapList = new JdbcTemplate(hr_ds0)
.queryForList(sql);
String jgbh = null;
if (mapList.size() != 0) {
jgbh = (String) mapList.get(0).get("code");
}
DataSource dataSource = DBConnectionPool.getInstance().getDataSource(
model);
String sql1 = "select jhxx,jhkssj from exchange_log where jhxxlx='交换异常信息' "
+ "and jgbh = '"
+ jgbh
+ "' and jhbm= '"
+ jhbm
+ "'"
+ "and jhkssj=(select max(jhkssj) from exchange_log where jgbh='"
+ jgbh + "' and jhbm='" + jhbm + "')";
mapList = new JdbcTemplate(dataSource).queryForList(sql1);
String exceptionsText = "";
if (mapList.size() != 0) {
for (int i = 0; i < mapList.size(); i++) {
Date jhkssj = (Date) mapList.get(i).get("jhkssj");
exceptionsText += jhkssj.toString();
String str = (String) mapList.get(i).get("jhxx");
if (str == null || "null".equals(str))
continue;
exceptionsText += (String) mapList.get(i).get("jhxx") + '\n';
}
}
Map<String, String> map = new HashMap<String, String>();
map.put("exceptionsText", exceptionsText);
DataResponse dr = new DataResponse(map);
dr.setSuccess(true);
directPrint(marshal(dr));
return true;
}
4.store的一种形式
var store = new Ext.data.JsonStore({
fields : ${fields},
root: 'data',
proxy: new Ext.data.HttpProxy({//用于访问数据对象
url: '${linkGet.href}'
})
});
var store=new Ext.data.Store({
url:"hello.xml",
render:new Ext.data.XmlReader({
record:"row"
},["id","name","organization","homepage"])
})
因为Store组件接受一个参数url,如果设置url,则ExtJS会创建一个Ext.data.HttpProxy对象,该对象通过制定的Connection或Ext.Ajax.request请求,从而可以读取到服务器端的数据。
var store=new Ext.data.Store({
url:"student.ejf?cmd=list",
reader:new Ext.data.JsonReader({
root:"result"
},["id","name","organization","homepage"])
})
或者
var store=new Ext.data.JsonStore({
url:"student.ejf?cmd=list",
root:"result",
fields:["id","name","organization","homepage"]
})
function sFn(){alert('保存成功');}
function fFn(){alert('保存失败');}
Ext.Ajax.request({
url:'student.ejf?cmd=save'
success:sFn
failure:fFn,
params:{name:'小李',email:'xiaoli@easyjf.com',homeDate:'1992-5-6',sex:'男'}
})
或者
var store =new Ext.data.JSonStore({
url:"link.ejf?cmd=list",
totalProperty:"results",
root:"rows",
fields:['title',{name:'username',mapping:'author'},
{name:'loginTimes',type:'int'},
{name:'lastLoginTime',mapping:'loginTime',type:'date'}]
})
5。store的另外一种形式,分组store
var gridStore = new Ext.data.GroupingStore({
remoteSort:true,
sortInfo:{field:'mk_name',direction:'ASC'},
groupField:'mk_name', //根绝这个分类
proxy: new Ext.data.HttpProxy({
url: '${linkGet.href}'
}),
reader:new Ext.data.JsonReader({
root: 'data',
totalProperty: 'totalCount',
idProperty: 'id'
},
//name后面的字段都是cm的index Ext.data.Record.create([{"name":"id"},{"name":"code"},{"name":"name"},{"name":"mk_name"},{"name":"exception"},{"name":"threhold"},{"name":"exchanging"},{"name":"ok"}])
),
baseParams :{
start : 0,
limit : 20
}
});
//配合grid
grid = new Ext.grid.GridPanel({
region : 'center',
store : store,
margins : '-1 -1 -1 0',
sm : new Ext.grid.RowSelectionModel({
singleSelect : true
}),
cm : cm,
view: new Ext.grid.GroupingView({
forceFit: true,
groupTextTpl: '{text} ({[values.rs.length]}条记录)'
}),
autoWidth : true
});
6.分页的实现
在 grid.getStore().load( {
params : {
start : 0,
limit :20
}
})
var pagingBar = new Ext.PagingToolbar( {
pageSize :2,
store : store,
displayInfo : true,
displayMsg : '显示 {0} - {1} 条记录,共 {2} 条记录',
emptyMsg : "记录为空"
});
7.根据grid的某条记录,将它的详细信息在一个新的窗口显示出来
function showTIProps() {
var data = self.getSelectedData(grid);
if (!data)
return;
Ext.Ajax.request( {
url : initialConfig.linkTIProps,
params : {
id : data.id
},
success : function(response, opts) {
Ext.MessageBox.hide();
var r = Ext.decode(response.responseText);
var logData = {
id : data.id,
text : r.data
}
if (r.success) {
var win = new TextEditorWindow( {
title : data.name,
editor : {
url : initialConfig.linkTIPropsSave,
data : logData
}
});
win.show();
} else
Ext.MessageBox.alert('错误', r.data);
},
failure : function(response, opts) {
Ext.MessageBox.hide();
self.getWorkshop().msg('提示', '日志获取请求失败');
}
});
}
8.一个页面A的window w元素的html属性指向另外一个页面B,如何在那个页面的B.js里面关闭这个window
在A.jsp里面定义一个变量v,在w定义完后,把它赋给v,然后再B.js里面使用
window.parent.v.close();
9.单击grid里面的一条记录,可以对其执行操作
grid.on('dblclick', function(e) {
actEdit.execute();
});
10。在使用Ext的事件时,我们一般是直接在控件上事件。对于所有的组件Component,都包含一个beforedestory事件,该事件会在Ext小会这一个事件时出发,如果事件响应函数返回false,则会取消组件的取消操作。
Ext.onReady(function(){
var win=new Ext.Window({
title:"不能关闭的窗口",height:200,width:300
});
win.on("beforedestory",function(){}
alert("想关闭我,这是不可能的!");
return false;
);
win.show();
})
-------------与下面的代码等价
Ext.onReady(function(){
var win=new Ext.Window({
title:"不能关闭的窗口",
height:200,width:300,
listener:{"beforedestory":function(obj){
alert("想关闭我,这是不可能的!");
obj.show();
return false;
}}
})
})
11.创建一个record
Ext.onReady(){
var MyRecord=Ext.data.Record.create([
{name:'title'},
{name:'username',mapping:'author'},
{name:'loginTime',type:'int'},
{name:'lastLoginTime',mapping:'loginTime',type:'date'}
]);
var r=new MyRecord({
title:'日志标题',
username:'easyjf',
loginTimes:100,
loginTime:new Date()
});
alert(MyRecord.getField('username').mapping;
alert(MyRecord.getField('lastLoginTime').type);
alert(r.data.username);
}
12.无论如何record.data.institute_id都只取第一个record的id,原因是它和另外一个变量重名了,应该保证js文件中的变量都不重名。