Looking for javascript to make sure that no duplicate values are chosen for several drop-down lists that have same options.
Could someone help me with that, please??? :confused:
Printable View
Looking for javascript to make sure that no duplicate values are chosen for several drop-down lists that have same options.
Could someone help me with that, please??? :confused:
Code:<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
function uniqueCoicesSetup(){
var warning = 'Only one of each item May be Selected from each Group!',
s = document.getElementsByTagName('select'),
f = function (e){
var s = uniqueCoicesSetup.ar;
for (var o = this.options.selectedIndex, i = s.length - 1; i > -1; --i)
if(this != s[i] && o && o == s[i].options.selectedIndex){
this.options.selectedIndex = 0;
if(e && e.preventDefault)
e.preventDefault();
alert(warning);
return false;
}
},
add = function(el){
uniqueCoicesSetup.ar[uniqueCoicesSetup.ar.length] = el;
if ( typeof window.addEventListener != 'undefined' )
el.addEventListener( 'change', f, false );
else if ( typeof window.attachEvent != 'undefined' ){
var t = function() {
return f.apply(el);
};
el.attachEvent( 'onchange', t );
}
};
uniqueCoicesSetup.ar = [];
for (var i = s.length - 1; i > -1; --i)
if(/nodupe/.test(s[i].className))
add(s[i]);
}
if(typeof window.addEventListener!='undefined')
window.addEventListener('load', uniqueCoicesSetup, false);
else if(typeof window.attachEvent!='undefined')
window.attachEvent('onload', uniqueCoicesSetup);
// -->
</script>
</head>
<body>
<div>
<select class="nodupe" name="l1">
<option value="" selected>Choose</option>
<option value="">Bob</option>
<option value="">Carol</option>
<option value="">Ted</option>
<option value="">Alice</option>
<option value="">Tom</option>
<option value="">Harry</option>
</select>
<select class="nodupe" name="l2">
<option value="" selected>Choose</option>
<option value="">Bob</option>
<option value="">Carol</option>
<option value="">Ted</option>
<option value="">Alice</option>
<option value="">Tom</option>
<option value="">Harry</option>
</select>
</div>
</body>
</html>
First of all, this code is great, I've been looking for this all morning to no avail. Anyway, I was wondering if there was a way to keep the value selected upon revisiting the page? The site I have is .asp driven site with Access and sometimes users may revisit the page to review their selection, only to find it reset and their choices gone. Thanks.
To a certain extent that is governed by the browser. Different browsers deal with that situation differently and depending upon how one returns to the page. There also are javascripts for that. Two on DD are:
http://www.dynamicdrive.com/dynamici...rmremember.htm
and:
http://www.dynamicdrive.com/dynamici...mremember2.htm
However, if you have asp, you could keep a record with it and have the page repopulate with any saved values. How this is done is well documented on various asp help pages around the web and may be found using your favorite search engine (like Google).