Some time ago someone gave me a script to do this:
A group of select inputs with identical options
When an option is selected from 1 dropdown it is removed from the others (unless its a blank one)
Now I'm reusing the script in another application that has multiple sets of dropdowns (but only 1 that the script needs to apply to)
It works fine except, all the options get jumbled up - in all the dropdowns.
The script is a little beyond my level of javascript - I think largely because it doesn't use 'sensible' variable names so its quite hard to follow. How can I modify the script to not mess up the order (most importantly of the other dropdowns that aren't having elements removed and added)
Code:
<script type='text/javascript'><!--//--><![CDATA[//><!--
var onoff = 1;
function SelInit(sobj,srt)
{ if (typeof(sobj)=='string'){ sobj=document.getElementById(sobj); }
srt=srt||0;
var p=sobj.parentNode.parentNode.parentNode;
p.ary=[];
var sels=p.getElementsByTagName('SELECT');
for (A0=0;A0<sels.length;A0++)
{ sels[A0].ary=p.ary;
p.ary.push(sels[A0]);
sels[A0].last=null;
sels[A0].srt=srt;
}
return p;
} // end of js fn SelInit
function RemoveDuplicates(obj,srt)
{ if (onoff)
{ if (typeof(obj)=='string'){ obj=document.getElementById(obj); }
if (!obj.ary){ SelInit(obj,srt); }
if (obj.replace)
{ for (B0=0;B0<obj.replace.length;B0++)
{ obj.replace[B0][0].appendChild(obj.replace[B0][1]);
}
}
obj.last=obj.options[obj.selectedIndex];
for (B1=0;B1<obj.ary.length;B1++)
{ obj.ary[B1].si=obj.ary[B1].options[obj.ary[B1].selectedIndex].value;
if (obj.ary[B1]!=obj)
{ SelOpts(obj.ary[B1],srt);
obj.ary[B1].opts.sort(SortOptions);
}
}
obj.replace=[];
for (B2=0;B2<obj.ary.length;B2++)
{ if (obj.ary[B2]!=obj)
{ for (var B3=0;B3<obj.ary[B2].opts.length;B3++)
{ if (obj.ary[B2].opts[B3][1]!=obj.si||obj.options[obj.selectedIndex].value.match('-1'))
{ obj.ary[B2].appendChild(obj.ary[B2].opts[B3][0]);
} else
{ obj.replace.push([obj.ary[B2],obj.ary[B2].opts[B3][0].cloneNode(true)]);
}
}
}
}
for (B3=0;B3<obj.ary.length;B3++)
{ obj.ary[B3].selectedIndex=0;
for (B4=obj.ary[B3].srt;B4<obj.ary[B3].options.length;B4++)
{ if (obj.ary[B3].options[B4].value==obj.ary[B3].si)
{ obj.ary[B3].selectedIndex=B4;
}
}
}
}
} // end of js fn RemoveDuplicates
function SelOpts(sobj,srt)
{ sobj.opts=[]; sobj.old=[];
for (var C0=srt;C0<sobj.options.length;C0++)
{ sobj.opts.push([sobj.options[C0].cloneNode(true),sobj.options[C0].value]);
sobj.old.push(sobj.options[C0]);
}
for (var C1=0;C1<sobj.old.length;C1++)
{ sobj.removeChild(sobj.old[C1])
}
} // end of js fn SelOpts
function SortOptions(a,b)
{ var A=parseInt(a[1]); var B=parseInt(b[1]);
if (A<B){ return -1; }
if (A>B){ return +1; }
return 0;
} // end of js fn SortOptions
//--><!]]></script>
if I set srt = 0 then the elements in the dropdowns that I'm trying to affect, stay in the same order except the blank element at the top - which moves down the list (usually somewhere between the bottom and the middle) . And the ones I want to stay the same get jumbled up.
If I set srt =1 then the blank one stays at the top but the others jumble about a bit (I'm not majorly bothered by this) but the other dropdowns still all get jumbled up
Before you post, read our: 
