Google Material Design-禁用开关

Question

I'm unable to find any actual web based code examples that demonstrates how to go about disabling a switch for Google Material Design JavaScript.

I've tried foo.setAttribute('disabled'); , foo.setAttribute(disabled); , and foo.setAttribute('state', 'disabled'); to no avail.

Answer 1

You can disable a material design component switch with javascript simply by setting the disabled property to true.

const elem = document.querySelector('#switch-id');
elem.disabled = true;

Answer 2

So I tried benvc's solution along with a ton of different variations of it with no success - I'm sure it's just something funky with the code I'm working with.

I ended up disabling the switch by changing the element's CSS properties:

elem.setAttribute("style","pointer-events: none;");

Answer 3

var switch = new mdc.switchControl.MDCSwitch(document.getElementByclassName('mdc-switch'));

//for enable switch.disabled = false;

//for disable switch.disabled = true;