javaScript下拉列表限制问题
现在想做一个部门排序，然后从数据库里读出部门里的人数（这个我能实现）,在每个人记录后面JSTL用循环标签加个下拉列表框，下拉列表框中的数值是和数据库中（部门表）中人数是一...
现在想做一个部门排序，然后从数据库里读出部门里的人数（这个我能实现）,在每个人记录后面JSTL用循环标签加个下拉列表框，下拉列表框中的数值是和数据库中（部门表）中人数是一致的，现在想为部分这些人做个排序，根据下拉列表选中的值，例如选中的是1，就是第一名，如果选中的是2，就是第二名，如果选中的是5就是第5名，但是我想完成的这个功能是这样的，不允许有二个或更多的人拥有一个名次，就是说，不能有2个人都是第一名，再白点说就是，下拉列表中的值不允许点重复的值。
展开
展开全部
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<script type="text/javascript" charset="utf-8">
var sele1;
var sele2;
var sele3;
var sele4;
var sele5;
var i1;
var i2;
var i3;
var i4;
var i5;
function initVars(){
sele1=document.getElementById('s1');//get select1 object
sele2=document.getElementById('s2');//get select2 object
sele3=document.getElementById('s3');//get select3 object
sele4=document.getElementById('s4');//get select4 object
sele5=document.getElementById('s5');//get select5 object
}
function judgeValue(select){
initVars();
i1=sele1.selectedIndex;
i2=sele2.selectedIndex;
i3=sele3.selectedIndex;
i4=sele4.selectedIndex;
i5=sele5.selectedIndex;
var a=new Array(i1,i2,i3,i4,i5);
var i=0,k;
for(k=0;k<5;k++){
if(select.selectedIndex==a[k]){
i++;
}
}
if(i>1){
alert('该数字已选,请重选!');
select.selectedIndex=0;
return false;
}
}
</script>
<title>display</title>
</head>
<body>
1.
<select id="s1" onchange="judgeValue(this);">
<option>
--请选择--
</option>
<c:forEach items="${userlist}" var="p" varStatus="i">
<option>
${i.index+1 }
</option>
</c:forEach>
</select>
2.
<select id="s2" onchange="judgeValue(this);">
<option>
--请选择--
</option>
<c:forEach items="${userlist}" var="p" varStatus="i">
<option>
${i.index+1 }
</option>
</c:forEach>
</select>
3.
<select id="s3" onchange="judgeValue(this);">
<option>
--请选择--
</option>
<c:forEach items="${userlist}" var="p" varStatus="i">
<option>
${i.index+1 }
</option>
</c:forEach>
</select>
4.
<select id="s4" onchange="judgeValue(this);">
<option>
--请选择--
</option>
<c:forEach items="${userlist}" var="p" varStatus="i">
<option>
${i.index+1 }
</option>
</c:forEach>
</select>
5.
<select id="s5" onchange="judgeValue(this);">
<option>
--请选择--
</option>
<c:forEach items="${userlist}" var="p" varStatus="i">
<option>
${i.index+1 }
</option>
</c:forEach>
</select>
</body>
</html>
已经发给楼主了..
祝楼主早日成功!!!
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<script type="text/javascript" charset="utf-8">
var sele1;
var sele2;
var sele3;
var sele4;
var sele5;
var i1;
var i2;
var i3;
var i4;
var i5;
function initVars(){
sele1=document.getElementById('s1');//get select1 object
sele2=document.getElementById('s2');//get select2 object
sele3=document.getElementById('s3');//get select3 object
sele4=document.getElementById('s4');//get select4 object
sele5=document.getElementById('s5');//get select5 object
}
function judgeValue(select){
initVars();
i1=sele1.selectedIndex;
i2=sele2.selectedIndex;
i3=sele3.selectedIndex;
i4=sele4.selectedIndex;
i5=sele5.selectedIndex;
var a=new Array(i1,i2,i3,i4,i5);
var i=0,k;
for(k=0;k<5;k++){
if(select.selectedIndex==a[k]){
i++;
}
}
if(i>1){
alert('该数字已选,请重选!');
select.selectedIndex=0;
return false;
}
}
</script>
<title>display</title>
</head>
<body>
1.
<select id="s1" onchange="judgeValue(this);">
<option>
--请选择--
</option>
<c:forEach items="${userlist}" var="p" varStatus="i">
<option>
${i.index+1 }
</option>
</c:forEach>
</select>
2.
<select id="s2" onchange="judgeValue(this);">
<option>
--请选择--
</option>
<c:forEach items="${userlist}" var="p" varStatus="i">
<option>
${i.index+1 }
</option>
</c:forEach>
</select>
3.
<select id="s3" onchange="judgeValue(this);">
<option>
--请选择--
</option>
<c:forEach items="${userlist}" var="p" varStatus="i">
<option>
${i.index+1 }
</option>
</c:forEach>
</select>
4.
<select id="s4" onchange="judgeValue(this);">
<option>
--请选择--
</option>
<c:forEach items="${userlist}" var="p" varStatus="i">
<option>
${i.index+1 }
</option>
</c:forEach>
</select>
5.
<select id="s5" onchange="judgeValue(this);">
<option>
--请选择--
</option>
<c:forEach items="${userlist}" var="p" varStatus="i">
<option>
${i.index+1 }
</option>
</c:forEach>
</select>
</body>
</html>
已经发给楼主了..
祝楼主早日成功!!!
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
解决重复数据办法:
1.后台数据库取数据时 消除重复数据
select distinct name,min(id) as id from 部门表 group by name order by id;
这样获得就是没有重复的数据了 min(id)可以改成max(id);看情况而定
2.后台数据库有重复数据，在前台使用js消除重复数据；
假设数组结构如下:
var arr = [
{id:1,name:'a'},
{id:2,name:'b'}, //重复
{id:3,name:'c'},
{id:4,name:'b'}, //重复
{id:5,name:'d'}
];
function merge(array){
var arr = array;
var len = arr.length;
for(var i=0;i<arr.length;i++){
for(var j=i+1;j<arr.length;j++){
if(arr[i].name == arr[j].name){
for(var k=j;k<arr.length-1;k++){
arr[k] = arr[k+1];
arr[k].id -= 1;
}//end for k
arr.pop();
}//end if
}//end for j
}//end for i
return arr;
}
arr = merge(arr);
得到结果如下:
arr = [
{id:1,name:'a'},
{id:2,name:'b'},
{id:3,name:'c'},
{id:4,name:'d'}
];
消除了重复数据b,并且顺序id自动.
1.后台数据库取数据时 消除重复数据
select distinct name,min(id) as id from 部门表 group by name order by id;
这样获得就是没有重复的数据了 min(id)可以改成max(id);看情况而定
2.后台数据库有重复数据，在前台使用js消除重复数据；
假设数组结构如下:
var arr = [
{id:1,name:'a'},
{id:2,name:'b'}, //重复
{id:3,name:'c'},
{id:4,name:'b'}, //重复
{id:5,name:'d'}
];
function merge(array){
var arr = array;
var len = arr.length;
for(var i=0;i<arr.length;i++){
for(var j=i+1;j<arr.length;j++){
if(arr[i].name == arr[j].name){
for(var k=j;k<arr.length-1;k++){
arr[k] = arr[k+1];
arr[k].id -= 1;
}//end for k
arr.pop();
}//end if
}//end for j
}//end for i
return arr;
}
arr = merge(arr);
得到结果如下:
arr = [
{id:1,name:'a'},
{id:2,name:'b'},
{id:3,name:'c'},
{id:4,name:'d'}
];
消除了重复数据b,并且顺序id自动.
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
如果我没理解错的话，可以有这样的一个思路：
建一个全局的二维数组，比如var rank = new Array();
rank['1'] = 'xxx';
其中'1'表示第一名，xxx表示第一名的名字或者它在页面中的排序都可以
这样就保存了一份关于名称列表对应的排名的映射
比如选把某个人的排名设置为5，则先查询一下rank['5']是不是已经有了，如果有了就表示已经有其他人是第5名了，则你这次选择无效，也就是什么都不作。如果rank['5']还没有被赋值，则给它赋值
建一个全局的二维数组，比如var rank = new Array();
rank['1'] = 'xxx';
其中'1'表示第一名，xxx表示第一名的名字或者它在页面中的排序都可以
这样就保存了一份关于名称列表对应的排名的映射
比如选把某个人的排名设置为5，则先查询一下rank['5']是不是已经有了，如果有了就表示已经有其他人是第5名了，则你这次选择无效，也就是什么都不作。如果rank['5']还没有被赋值，则给它赋值
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<HTML>
<HEAD>
<TITLE></TITLE>
<script>
</body>
</HTML>
<HEAD>
<TITLE></TITLE>
<script>
</body>
</HTML>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这分我要了。下班回家给你搞定.
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
假如你用得是EXTJS这个当前最流行的框架，你就知道这个问题根本就不是啥大问题了，Extjs这个框架支持前台后台排序的！并且可以按不同的列来排序的！！所以你可以去了解一下啊extjs这个框架！！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（4）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
