JSFiddle - React, Tailwind, and code Playground

by mowglisanu

HTML

<form method="post" action="appointment.php">
    <label><input type="radio" name="time" value="8:00" required><span> 8:00 AM</span></label>
    <label><input type="radio" name="time" value="8:30" required><span> 8:30 AM</span></label>
    <label><input type="radio" name="time" value="9:00" required><span> 9:00 AM</span></label>
    <label><input type="radio" name="time" value="9:30" required><span> 9:30 AM</span></label>
    <label><input type="radio" name="time" value="10:00" required><span>10:00 AM</span></label>
    <label><input type="radio" name="time" value="10:30" required><span>10:30 AM</span></label>
    <label><input type="radio" name="time" value="11:00" required><span>11:00 AM</span></label>
    <label><input type="radio" name="time" value="11:30" required><span>11:30 AM</span></label>
    <input type="submit" name="submit" value="Make appointment">
</form>

JavaScript

document.querySelector('[required]').disabled = true;