I'm building a web form and I currently have five 'drop-down' menus (using the select tag) that allow users to choose a value from 0-5. It looks like this:
Choose one: <select name="choose_one" required> <option value=""></option> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> </select>
Is there anything I can do to disable a certain number from being chosen again if it is chosen on a select menu in other menus? Meaning, if I select 1 on the first drop-down menu I come across, I wouldn't be able to select it again on the others.
A potential solution I was considering was making a table of radio buttons. When a user selects a number, it disables that whole row of numbers. However I'm not really sure if I could do this in HTML. I think I'd need to use JS/JQuery.
One of the issues here is that 0 should be able to be selected multiple times, but a column needs to be disabled after a value for that column has been selected. The 0 field could be checkboxes, but then the style wouldn't be the same as the radio buttons.