javascript - How to disable value when its chosen once by the user? -
javascript - How to disable value when its chosen once by the user? -
i want disable value alternative 1 time user chooses it.
for illustration if user chooses (7:00 am) next time go , click on drop-down 1 time again value won't available them choose. best way this?
<td> time display (please come in time format hh:mm tt): <td> <select id="time_used" name="time_used" validate="date" > <option selected> select time</option> <option value="7:00 am">7:00 am</option> <option value="7:15 am">7:15 am</option> <option value="7:30 am">7:30 am</option> <option value="7:45 am">7:45 am</option> <option value="8:00 am">8:00 am</option> <option value="8:15 am">8:15 am</option> <option value="8:30 am">8:30 am</option> <option value="8:45 am">8:45 am</option> <option value="9:00 am">9:00 am</option> <option value="9:15 am">9:15 am</option> <option value="9:30 am">9:30 am</option> <option value="9:45 am">9:45 am</option> <option value="10:00 am">10:00 am</option> </select> </td> </td>
@ncksllvn's reply works, propose different solution.
it's been our experience @ work disabled controls have 2 major drawbacks.
they not sent part of submit. users confused border, not selectable.the sec issue applies if seek create read command well.
<td> time display (please come in time format hh:mm tt): <td> <select id="time_used" name="time_used" validate="date" > <option selected> select time</option> <option value="7:00 am">7:00 am</option> <option value="7:15 am">7:15 am</option> </select> <span id="time_used_display" style="display:none"></span> </td> </td> function disabledtimeselect() { var timeselect = document.getelementbyid('time_used') var value = timeselect.options[timeselect.selectedindex].value; if (value === "") { return; } timeselect.style.display = "none"; var span = document.getelementbyid("time_used_display"); span.innerhtml = value; span.style.display = "inline"; } window.onload = function() { disabledtimeselect(); };
edit
from mdn docs:
this boolean attribute indicates form command not available interaction. in particular, click event not dispatched on disabled controls. also, disabled control's value isn't submitted form.
javascript
Comments
Post a Comment