Unable to make select disable and enable

Question

I want to make text and select option disable and enable when i click on edit and save button respectively. In my case text field is being disabled and enabled onclick but select dropdown is not being disbled and enabled. In javascript i had called the class to make text field disable and enable. How to make for select.

$(document).ready(function() {
  $('.editBtn').click(function() {
    if ($('.editField').is('[readonly]')) { //checks if it is already on readonly mode
      $('.editField').prop('readonly', false); //turns the readonly off
      $('.editBtn').html('<span class="glyphicon glyphicon-floppy-disk">&nbsp;</span>'); //Changes the text of the button
    } else { //else we do other things
      $('.editField').prop('readonly', true);
      $('.editBtn').html('<span class="glyphicon glyphicon-pencil">&nbsp;</span>');
    }
  });
});

HTML:

<select id="dept" class="form-control editField" required></select>

Answer 1

Since you're using jQuery, you can do this to enable the select:

$('.mySelect').prop('disabled', false); //enabled

And this to disable the select:

$('.mySelect').prop('disabled', true); //disabled