利用jqgrid实现上移下移单元格功能

2023-09-06 03:01:04 332

前言

JQGrid是一个在jquery基础上做的一个表格控件，以ajax的方式和服务器端通信。

在表格中常常需要调整表格中数据的显示顺序，我用的是jqgrid,实现原理就是将表中的行数保存到数据库中，取数据时按行进行排序

下面话不多说了，来一起看看详细的介绍吧

jqgrid上移下移单元格

1、上移，下移按钮

上移
下移

2、上移下移功能

functionoperateWithOneRowById(callback){
varselected=tableObj.jqGrid('getGridParam','selrow');
if(selected==null){
alert("请用鼠标点击选择一行后再执行操作!");
return;
}
returncallback(selected);
}

3、这里的callback是up和down函数的合并，那么我们再看看这两个函数

functionup(selected){
if(selected==1)return;
else{
gridHelper.moveRow("up",tableObj);
}
}

functiondown(selected){
gridHelper.moveRow("down",tableObj);
}

4、在这个函数中，我们都调用了一个函数movRow()让我们来看看这个函数，这个函数的原理就是把当前选中的行和我要移到至的行进行交换就行了。

//移动一行
this.moveRow=function(moveMethod,grid){
if(grid)tableObj=grid;
varid;
//if(selRow)id=selRow;
//elseid=getSelRow();
id=this.getSelRow();
tableObj.restoreRow(id);
if(id==null)return;
vartargetId=this.getTargetId(id,moveMethod)
if(targetId==-1)return;

vartemp1=tableObj.getRowData(id);
vartemp2=tableObj.getRowData(targetId);
//对调行号
vartempRn=temp1.rn;
temp1.rn=temp2.rn;
temp2.rn=tempRn;
//对调数据
tableObj.setRowData(id,temp2);
tableObj.setRowData(targetId,temp1);
tableObj.setSelection(targetId);
}

5、在4中调用了getTargetId（）方法，我们再来看看这个方法

//取得上移时的上一行的id，或下移时的下一行的id
this.getTargetId=function(selId,method,grid){
if(grid)tableObj=grid;
varids=tableObj.getDataIDs();
for(vari=0;i
6、增加数据库字段Sequence 我用的nhibernate还要在配置文件中进行修改，增加一行 实体类中增加字段order，在保存表时保存表中的行号


保存数据说明：保存时是保存表中的所有数据，有已经在数据库中的数据，有没有存在数据库中的数据，根据IDj是否为0来判断的。
publicvoidUpdatePlan(PlanToReportplan,Listlist)
{
NHibernate.ISessionsession=NHibernateSessionManager.Instance.GetSession();
try
{
PlanToReportService.UpdatePlan(plan);
for(inti=0;i
7、取数据时根据Order字段进行排序
publicListGetShowPersonInPlan(intplanID)
{
ISessionsession=NHibernateSessionManager.Instance.GetSession();
ICriteriacriteria=session.CreateCriteria(typeof(PlanPersonShowInGrid));
criteria.Add(Expression.Eq("PlanID",planID)).AddOrder(Order.Asc("Order"));
Listlist=newList();
try
{
IListl=criteria.List();
list=PlanToReportDao.IListToList(l);
}
catch{}
returnlist;
}
至此，表格中数据的上移下移就完成了。
总结：
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对毛票票的支持。

利用jqgrid实现上移下移单元格功能

热门推荐

随机推荐