如题,详见如下示例:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<link rel="stylesheet" type="text/css" href="ExtJs/resources/css/ext-all.css" mce_href="ExtJs/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="jmaki-standard.css" mce_href="jmaki-standard.css" />
<mce:script type="text/javascript" src="ExtJs/adapter/ext/ext-base.js" mce_src="ExtJs/adapter/ext/ext-base.js"></mce:script>
<mce:script type="text/javascript" src="ExtJs/ext-all.js" mce_src="ExtJs/ext-all.js"></mce:script>
<mce:script type="text/javascript"><!--
var storeFatList;
var cmFatList;
var gridFatList;
var sm = new Ext.grid.CheckboxSelectionModel();
Ext.onReady(viewFatlist);
function viewFatlist()
{
if(storeFatList==null)
{
storeFatList = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: 'auditUsr.action'
}),
// create reader that reads the Topic records
reader: new Ext.data.JsonReader({
root: 'usrs',
totalProperty: 'totalCount',
successProperty :'success',
id: 'threadid',
fields: [
{name: 'uid',mapping:'uid',type:'int'},
{name: 'userName', mapping:'uname',type:'string'},
{name: 'email', mapping:'email',type:'string'},
{name: 'status',mapping:'state',type:'int'}
]
})
});
}
// the column model has information about grid columns
// dataIndex maps the column to the specific data field in
// the data store
if(cmFatList==null)
{
cmFatList = new Ext.grid.ColumnModel([
sm,
{
header: "用户名",
dataIndex: 'uid'
},{
header: "姓名",
dataIndex: 'userName'
},{
header: "Email",
dataIndex: 'email'
},{
header: "状态",
dataIndex: 'status'
}]);
cmFatList.defaultSortable = true;
}
if(gridFatList==null)
{
gridFatList = new Ext.grid.GridPanel({
el:'noAuditUsers',
store: storeFatList,
frame:true,
width:685,
height:400,
title:'查询结果',
collapsible :true,
cm: cmFatList,
sm: sm,
trackMouseOver:false,
loadMask: false,
tbar: new Ext.PagingToolbar({
pageSize: 20,
store: storeFatList,
displayInfo: true,
cls: 'x-btn-text-icon details',
displayMsg: '显示的结果 {0} - {1} / {2}',
emptyMsg: "没有符合查询条件的记录"
})
});
}
gridFatList.render();gridFatList.collapse(true);
storeFatList.load({params:{start:0, limit:20}});
}
//返回被选择的行的UID
function getFatSelectedIdArray()
{
var record=gridFatList.getSelectionModel().getSelections();
if(record == null || record.length == 0)
return null;
var array = new Array(record.length);
for(var i=0;i<record.length;i++)
{
array[i] = record[i].get('uid');
}
return array;
}
//响应 用户成正式用户 按钮事件
function setDueUser()
{
array = getFatSelectedIdArray();
if(array == null)
{
alert('请选择用户然后再执行操作');
return;
}
var info = '';
for(var i=0;i<array.length;i++)
{
info += array[i] + ';';
}
var conn = new Ext.data.Connection();
// 发送异步请求
conn.request({
// 请求地址
url: 'executeAudit.action',
method: 'GET',
params:'uid=' + info,
// 指定回调函数
callback: callback
});
//回调函数
function callback(options, success, response){
if(success)
{
if(response.responseText.trim() == "1")
{
alert('审核成功');
storeFatList.reload();
}
else
alert('操作失败,请重试');
}
else
alert('连接超时,请重试');
}
}
function refreshData()
{
setTimeout(function()
{
storeFatList.reload();
},1000);
}
// --></mce:script>
</head>
<body>
<div id="noAuditUsers"></div><br/>
<input type="button" onclick="setDueUser();" value="审核">
</body>
</html>