最近项目中遇到了上移下移操作的一个操作,以前也看到过,但一直没有去研究过,这次项目中遇到了,也就去研究了一把,其实实现原理也挺简单的,说白了就是
要记录数据库里的要进行排序表的总记录数量,然后根据循环的次数,多写几个隐藏变量,进行上移下移操作的时候进行判断就可以了。
现在一起来看看具体的代码实现吧,希望会对那些没有做过这些操作的朋友有所帮助。
此版本为java版,上午已经写过了asp版本了,希望会对朋友们有所帮助。
具体实现:
<%@ page language="java" pageEncoding="utf-8"%>
<%@ page import="com.util.services.DbConnection" %>
<%@ page import="java.sql.*" %>
<%!
DbConnection conn = new DbConnection();
String sql = "";
int totalNum = 0;
ResultSet rs = null;
String moveflag = "";
%>
<%
moveflag = request.getParameter("moveflag");
if(null!=moveflag && !"".equals(moveflag)){
String movetype="";
int premenuid=0;
int premenuordernum=0,nextmenuid=0,nextmenuordernum=0,nowmenuid=0,nowmenuordernum=0;
movetype = request.getParameter("movetype");
nowmenuid = Integer.parseInt(request.getParameter("nowmenuid"));
nowmenuordernum = Integer.parseInt(request.getParameter("nowmenuordernum"));
if(movetype.equals("up")){
premenuid = Integer.parseInt(request.getParameter("premenuid"));
premenuordernum = Integer.parseInt(request.getParameter("premenuordernum"));
sql = "update c_menu set ordernum="+ premenuordernum +" where menuid="+ nowmenuid;
conn.executeUpdate(sql);
sql = "update c_menu set ordernum="+ nowmenuordernum +" where menuid="+ premenuid;
conn.executeUpdate(sql);
}
if(movetype.equals("down")){
nextmenuid = Integer.parseInt(request.getParameter("nextmenuid"));
nextmenuordernum = Integer.parseInt(request.getParameter("nextmenuordernum"));
sql = "update c_menu set ordernum="+ nextmenuordernum +" where menuid="+ nowmenuid;
conn.executeUpdate(sql);
sql = "update c_menu set ordernum="+ nowmenuordernum +" where menuid="+ nextmenuid;
conn.executeUpdate(sql);
}
out.println("<script>parent.location.href='index.jsp';</script>");
}
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>类型排序——上移下移操作(Java版)</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="类型排序,上移下移操作,java">
<meta http-equiv="description" content="类型排序——上移下移操作(Java版)">
<link rel="stylesheet" type="text/css" href="style/Styles.css">
<script language="javascript">
function moveMenu(menuid,menuordernum,movetype){
var num,prenum,premenuid,nextnum,nextmenuid,maxnum;
document.getElementById("movetype").value = movetype;
num = parseInt(menuordernum);
if(movetype=="up"){
if(num==1){
alert("当前已经处于第一位!");
}else{
prenum = document.getElementById("menuorder_"+(num-1)).value;
premenuid = document.getElementById("menuid_"+(num-1)).value;
document.getElementById("premenuid").value = premenuid;
document.getElementById("premenuordernum").value = prenum;
document.getElementById("nowmenuid").value = menuid;
document.getElementById("nowmenuordernum").value=menuordernum;
document.getElementById("form2").submit();
}
}else{
maxnum = parseInt(document.getElementById("totalMenus").value);
if(num>=maxnum){
alert("已经处于最后了!");
}else{
nextnum = document.getElementById("menuorder_"+(num+1)).value;
nextmenuid = document.getElementById("menuid_"+(num+1)).value;
document.getElementById("nextmenuid").value = nextmenuid;
document.getElementById("nextmenuordernum").value = nextnum;
document.getElementById("nowmenuid").value = menuid;
document.getElementById("nowmenuordernum").value = menuordernum;
document.getElementById("form2").submit();
}
}
}
</script>
</head>
<body>
<table id="Table1" cellSpacing="0" cellPadding="0" width="100%" border="0" align="center">
<tr>
<td align="center">
<table id="Table4" cellSpacing="0" cellPadding="0" width="98%" align="center" border="0">
<tr>
<td align="center">
<table class="td_table" cellspacing="1" cellpadding="0" align="center" rules="all" border="0" width="100%" ID="Table5">
<tr bgColor="#d8e5ff" height=23>
<td align="center" width="60"><b>序号</b></td>
<td align="center"><b>栏目名称</b></td>
<td align="center" width="60"><b>操作</b></td>
</tr>
<%
// 计算总记录数
sql = "select count(*) as totalNum from c_menu";
rs = conn.executeSql(sql);
if(rs.next()){
totalNum = rs.getInt("totalNum");
}
if(rs!=null){
try{
rs.close();
}catch(Exception e){
e.printStackTrace();
}
}
int i = 0;
// 显示详细信息
sql = "select * from c_menu order by ordernum asc";
rs=conn.executeSql(sql);
%>
<tr>
<td colspan="10" height="1" bgcolor="#d8e5ff"></td>
</tr>
<%
String color = "";
out.println("<input type=\"hidden\" name=\"totalMenus\" id=\"totalMenus\" value=\""+totalNum+"\">");
while(rs.next()){
if(i%2==0){
color = "#f3f6ff";
}else{
color = "#ffffff";
}
%>
<tr bgcolor="<%=color%>" height=23>
<td align="center"><%=i+1%><input type="hidden" name="menuorder_<%=i+1%>" id="menuorder_<%=i+1%>" value="<%=i+1%>"><input type="hidden" name="menuid_<%=i+1%>" id="menuid_<%=i+1%>" value="<%=rs.getInt("menuid")%>"></td>
<td align="left"> <font color=red><%=rs.getString("MenuName")%></font></td>
<td align="center">
<a href="#" onclick="moveMenu('<%=rs.getInt("menuid")%>','<%=i+1%>','up');"><img src="images/icon_digg.gif" border="0" alt="上移"/></a>
<a href="#" onclick="moveMenu('<%=rs.getInt("menuid")%>','<%=i+1%>','down');"><img src="images/icon_bury.gif" border="0" alt="下移"/></a>
</td>
</tr>
<%
i=i+1;
}
%>
</table>
</td>
</tr>
<tr>
<td colspan="2" height="1" bgcolor="#d8e5ff"></td>
</tr>
<%
if(rs!=null){
try{
rs.close();
}catch(Exception e){
e.printStackTrace();
}
}
%>
</table>
</td>
</tr>
</table>
<form action="index.jsp" method="post" name="form2" id="form2">
<input type="hidden" name="moveflag" id="moveflag" value="1">
<input type="hidden" name="movetype" id="movetype">
<input type="hidden" name="premenuid" id="premenuid">
<input type="hidden" name="premenuordernum" id="premenuordernum">
<input type="hidden" name="nowmenuid" id="nowmenuid">
<input type="hidden" name="nowmenuordernum" id="nowmenuordernum">
<input type="hidden" name="nextmenuid" id="nextmenuid">
<input type="hidden" name="nextmenuordernum" id="nextmenuordernum">
</form>
</body>
</html>
之前已经发布过asp版本了,此处就不多说了。如果有需要源代码的朋友的话,可以去我的博客里看看:
文章地址:
分类排序方法——上移下移操作(Java版)
分享到:
相关推荐
上 移 下 移 代 码 好的 参考
项目开发中列表展示页面涉及到一些条目的上下移动 ,由于数据量大时,服务端代码比较耗时, 所以我使用mysql 存储过程完成上下移动,比较通用方法,欢迎大家下载学习,共同进步
上移 下移 动态移动,上移 下移 动态移动,上移 下移 动态移动,
asp.net vs05版Gridview上移下移功能,能满足上移下移功能
个性化表格上移下移,很特别的个性化表格,希望有人能用的到。。。。。。。。。。。。
实现上移下移功能,具体绑定一个数据源,操作数据源,最后把数据源赋值给数据源。
NULL 博文链接:https://632902651-qq-com.iteye.com/blog/1676286
table上移下移table上移下移table上移下移table上移下移
treeview添加,删除,修改,上移,下移节点等功能
后台上移下移,编辑,删除效果后台上移下移,编辑,删除效果
php上移一位下移一位 源码我修改完善后 亲测可用 已多次应用到网站的。
jquery做的动态增加修改删除表格,上移下移功能,实际项目应用的,大家试试,支持多表格
对于GridPanel中拖动选中行排序的实现,网上有不少ExtJs实现的例子,但是...4、加了【最上】【最下】【上移】【下移】四个按钮排序的功能。目前按钮排序只能在Grid的单选模式下使用。 实现说明与功能演示请见我的Blog
ASP.NET中TreeView节点上移下移 实现无刷新效果
GridView控件行数据上移、下移的实现,Visual Studio2010、Sqlserver2008。
主要介绍了jQuery基于排序功能实现上移、下移的方法,结合实例形式分析了jQuery使用ajax与后台php交互实现元素的排序,上移、下移功能相关操作技巧
ztree,右击(点击小图标)上移、下移、置顶、置底。点击空白隐藏div
简单的签到列表选择,实现选择上移、下移。简单的签到列表选择,实现选择上移、下移。
js动态构建可以置顶、置底、上移、下移、添加、删除的table,