Disabling material select using JavaScript


Topic: Disabling material select using JavaScript

russ pro asked 5 years ago

Hi, is it possible to disable (or enable) a Material Select using Javascript? I've tried the following with no success.

var sel = document.getElementById('my-select');
sel.setAttribute("disabled", true);

Thanks for any help. :-)


Tina Meadors pro answered 5 years ago

Try: document.getElementById("my-select").disabled = true;

https://www.w3schools.com/jsref/prop_select_disabled.asp


russ pro commented 5 years ago

Thanks for the suggestion but sadly it didn't work for me. Did you try it yourself with any success?


Tina Meadors pro commented 5 years ago

I had not tried it myself, so I gave it a go. I discovered that you have to destroy and reinitialize the select after you add the disabled attribute. Here's what worked for me:

document.getElementById("airfillselect").disabled = true; $('.mdb-select').materialSelect({ destroy: true }); $('.mdb-select').materialSelect();


Tina Meadors pro commented 5 years ago

I made a snippet for you here. (First time ever, so I hope I'm doing this right)

https://mdbootstrap.com/snippets/jquery/tinameadors-com/936844


Krzysztof Wilk staff answered 5 years ago

Hello!

Try to make onClick event and do something like this in it:

$(yourElement).removeAttr('active');
$(yourElement).attr('disabled');

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.8.5
  • Device: PC
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: No