Search code examples
javascripthtmlmaterial-design-lite

Google MDL Lite : How can I progmmatically init a checkbox or switch?

in google's material design lite framework When I load this HTML into the page sometime after its already loaded I don't see the nice little switch like i do if this HTML was present before the library was loaded.

https://getmdl.io/components/index.html#toggles-section

<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="switch-1">
  <input type="checkbox" id="switch-1" class="mdl-switch__input" checked>
  <span class="mdl-switch__label"></span>
</label>

is there a function I can run to init the elements as they appear? I have searched for hours with failure as my only result :(

Solution

  • found out how to update registered components by reading the .js file.

    componentHandler.upgradeAllRegistered()