view raw
user3771102 user3771102 - 1 year ago 76
HTML Question

How to force user to select a value from dropdown and button to enable the save button?

I would like to know how to add a listener for the combo box from the form? I already have a code for the listener for the radio button. What I want is to force the user to select from the combo box and radio button before the submit button is enabled.

The script below is for when the radio button is selected the submit button is enabled.

EnableSubmit = function (val) {
var sbmt = document.getElementById("Submit");

if (val.checked == true) {
sbmt.disabled = false;
else {
sbmt.disabled = true;

Here is my jsfiddle so far.

The question is how can I add a listener for the combo box to enable the submit button once all the fields in the form is filled up. Thank you very much in advance!


I added a
to the script. It kind of work first try but when you change your answer the submit button gets disabled and enabled. I guess it shouldn't be
but I dunno for sure. Any ideas?

Here is the jsfiddle.

It seems only the radio button enables the submit button. T^T


Because I tend to be the most lazy person ever (read: someone who likes being effecient) I tend to use html5's form.checkValidity function, which appears usable in most modern browsers. If you plan to allow less than IE11, Edge 13, Firefox 46, or Chrome 50 (not including the mobile browsers) then this is definitely not the method for you.

$(document).ready(function() {
  $('#register input,textarea,select').on('change', function() {
    var form = this.form;
    var isValid = form.checkValidity();
    $(':submit').attr('disabled', !isValid);

<script src=""></script>
<form id="register">
  <input type="text" placeholder="Hello" required />Click the Radio Button
  <input type="radio" name="something" value="yes" required/>
  <br />
  <select name="something_else" required>
    <option value="1">One</option>
    <option value="2">TWo</option>
  <button type="submit" disabled="true">Submit</button>