Prevent user of selecting same values on select html -


i have 2 selects same values

eg:

<select id="1">   <option value="volvo">volvo</option>   <option value="saab">saab</option>   <option value="mercedes">mercedes</option>   <option value="audi">audi</option> </select>  <select id="2">   <option value="volvo">volvo</option>   <option value="saab">saab</option>   <option value="mercedes">mercedes</option>   <option value="audi">audi</option> </select> 

how can prevent user not choose same values on both boxes?

i populating select values php database.

edit:

i arrived on this: jsfiddle

but needs improvement when changing value selected.

first of html , css not designed that.

said that,maybe can hack css similar since <option> inside both <select> haven't relationship (child-parent, sibling...) can not use css pseudo selector (:checked)to disable options that:

(this code wont work case remove duplicates if options in same <select> because sibling)

[value="volvo"]:checked + [value="volvo"] {display: none;} 

Popular posts from this blog

c# - ODP.NET Oracle.ManagedDataAccess causes ORA-12537 network session end of file -

matlab - Compression and Decompression of ECG Signal using HUFFMAN ALGORITHM -

utf 8 - split utf-8 string into bytes in python -