前台extjs的js代码：
Ext.onReady(function () {
Ext.create('Ext.container.Viewport', {
layout: 'border',
width:500,
items: [
{
region: 'center',
xtype: 'tabpanel',
items: [
Qgrid
]
}]
});
});
var pageSize = 4;//每页多少数据
var gridstore = Ext.create('Ext.data.Store', {
storeId:'QsimpsonsStore',
pageSize: pageSize,//分页。。。
fields: [
{ name: 'ID', type: 'int' },
{ name: 'NAME', type: 'string' },
{ name: 'IDENT', type: 'string' },
{ name: 'qualify', type: 'bool' },
{ name: 'exam_date', type: 'string' },
{ name: 'nowtime', type: 'string' }
],//定义字段
proxy:{
type: 'ajax',
url:'studentgridAction.action', //请求的数据的url -------下面有后台代码
reader:{
type:'json',
root:'students', //对应action中需要被现实的字段
totalProperty: 'total' //数据总数
}
},
sorters:[{property:"ID",direction:"ASC"}],//按qq倒序
autoLoad:{params:{start:0,limit:pageSize}}//自动加载，每次加载一页
})
//------------------
function renderSex(value, cellmeta, record, rowIndex, columnIndex, store)//value当前单元格的值，record是这行的所有数据，store表格里所有的数据
{
if(value==false)
{
return "<span style='color:red;font-weight:bold;'>无</span>";
}
else
{
//return record.get('qualify');
return "<span style='color:green;font-weight:bold;'>有</span>";
}
}
//----------------
var Qgrid=Ext.create("Ext.grid.Panel",{
title:'学生列表',
frame: true,
rowLines: false,
columns: [//配置表格列
//序号
Ext.create("Ext.grid.RowNumberer",{
width: 40,
text:'序号'
}),
{header: "学生账号", width: 200, dataIndex: 'ID', sortable: false},//renderer:renderSex可自定义显示
{header: "学生姓名", width: 200, dataIndex: 'NAME', sortable: false},
/*{header: "考试资格", width: 200, dataIndex: 'qualify', xtype: 'booleancolumn', sortable: false,
trueText: "<span style='color:green;font-weight:bold;'>有</span>",
falseText: "<span style='color:red;font-weight:bold;'>无</span>" //一样效果
}*/
{header: "考试资格", width: 200, dataIndex: 'qualify', sortable: false,renderer:renderSex}//渲染函数
],
store:gridstore,//指定grid的数据源
//多选框
selType:'checkboxmodel',
multiSelect:true,
//分页控件
dockedItems: [
{
xtype: 'pagingtoolbar',
pageSize : pageSize,//分页....
store:gridstore,
dock: 'bottom', //分页 位置
emptyMsg: '没有数据',
displayInfo: true,
displayMsg: '当前显示{0}-{1}条记录 / 共{2}条记录 ',
beforePageText: '第',
afterPageText: '页/共{0}页'
}],
tbar:[
'-','-',{
icon: 'images/add.png',
text:"添加资格",
type:"submit",
handler:function(buttonObj){
var grid1=buttonObj.ownerCt.ownerCt;
var data=grid1.getSelectionModel().getSelection();
if(data.length==0){
Ext.example.msg('<font color="#ff9900">警告</font>',"请先选择学生！");
}
else{
//得到ID的数据
var st=grid1.getStore();
var ids=[];
var name=[];
var exam_data=[];
var nowtime=[];
var k=1;
Ext.Array.each(data,function(record){
if(k==1)
{
exam_data.push(record.get('exam_date'));
nowtime.push(record.get('nowtime'));
}
k++;
});
if(exam_data>nowtime)
{
Ext.Array.each(data,function(record){
if(record.get('qualify')==true)
{
//Ext.example.msg('<font color="#0000ff">温馨提示</font>',""+record.get('NAME')+"重新被授予资格");
name.push(record.get('NAME'));
}
else
{
ids.push(record.get('ID'));
}
});
/*if(name.length>0)
{
Ext.MessageBox.alert("提示框","<br>"+name+"<br><br>已经具有考试资格,无需再授予资格<br>");
}*/
if(ids.length>0)
{
Ext.Ajax.request({
url:'qualificationMan.action',
params:{ids:ids.join(",")},//传值到后台,单传2个值到后台时以,分开
method:'POST',
timeout:2000,
success:function(response,opts){
Ext.example.msg('<font color="#0000ff">温馨提示</font>','资格授予成功！');
Qgrid.store.reload();//重新加载数据
}
})
}
}
else
{
Ext.example.msg('<font color="#ff9900">警告</font>','考试已经开始或已经结束,不能再授权!');
}
}
}
},'-','-',
{
icon: 'images/delete.png',
text:"取消资格",
type:"submit",
handler:function(buttonObj){
var grid1=buttonObj.ownerCt.ownerCt;
var data=grid1.getSelectionModel().getSelection();
if(data.length==0){
Ext.example.msg('<font color="#ff9900">警告</font>','请先选择学生！');
}
else
{
//得到ID的数据
var st=grid1.getStore();
var ids=[];
var name=[];
var exam_data=[];
var nowtime=[];
var k=1;
Ext.Array.each(data,function(record){
if(k==1)
{
exam_data.push(record.get('exam_date'));
nowtime.push(record.get('nowtime'));
}
k++;
});
if(exam_data>nowtime)
{
Ext.Array.each(data,function(record){
if(record.get('qualify')==false)
{
name.push(record.get('NAME'));
}
else
{
ids.push(record.get('ID'));
}
});
/*if(name.length>0)
{
Ext.MessageBox.alert("提示框","<br>"+name+"<br><br>不具有考试资格,无需取消资格<br>");
}*/
if(ids.length>0)
{
Ext.Ajax.request({
url:'Cancelqualification.action',
params:{ids:ids.join(",")},//传值到后台,单传2个值到后台时以,分开
method:'POST',
timeout:2000,
success:function(response,opts){
Ext.example.msg('<font color="#0000ff">温馨提示</font>','资格取消成功！');
Qgrid.store.reload();//重新加载数据
}
})
}
}
else
{
Ext.example.msg('<font color="#ff9900">警告</font>','考试已经开始或已经结束,不能取消授权!');
}
}
}
}
]
});
structs.xml
<action name = "studentgridAction" class ="teacher_qualification.Action" method="getstudent">
<result name="students" type="json"></result>
</action>
后台java代码实现函数：
public List<Model>students;//和 grid的store的root:'students',对应
public Integer total;//分页。。。数据总数
public Integer start;//分页。。。每页开始数据
public Integer limit;//分页。。。每一页数据
//省略get和set的方法，一定要get和set，不然前台获取不到值
public String getstudent()
{
// HttpServletRequest request = ServletActionContext.getRequest();set seesion的值
//request.getSession().setAttribute("testid", testid);
HttpServletRequest request = ServletActionContext.getRequest();
String oppo=(String) request.getSession().getAttribute("testid");//获取考试的id。seesion方法
int testid=Integer.parseInt(oppo);//试卷ID
users=new ArrayList<Student>();
users=remote().Partstudents("学生");//得到所有學生
students=new ArrayList<Model>();
//分页
total=users.size();
int end=start+limit;
if(end>users.size())//不能总数
{
end=users.size();
}
for(int i=start;i<end;i++)//只加载当前页面数据
{
Model ok=new Model();
ok.setID(users.get(i).getID());
ok.setNAME(users.get(i).getNAME());
ok.setIDENT(users.get(i).getIDENT());
List <qualification>fuck=new ArrayList<qualification>();
fuck=remote1().getqualificationParts(users.get(i).getID(), testid);
if(fuck.size()>0)
{
ok.setQualify("true");
}
else
{
ok.setQualify("false");
}
ok.setExam_date(exam_data);
ok.setNowtime(nowtime);
students.add(ok);
}
System.out.println("start:"+start+" end:"+end);
return "students";
}