I need to dynamically create a Switchery switch.
I'm creating non-dynamic switches like this:
<div class="item form-group">
<label class="control-label col-md-3 col-sm-3 col-xs-12">Admin User</label>
<div class="col-md-6 col-sm-6 col-xs-12">
<input type="checkbox" class="js-switch" id= "canModify"/>
</div>
</div>
And this works just fine.
However when I create the same structure via JavaScript like this:
html = '<input type="checkbox" class="js-switch" id= "' + elementID + '"/>'
I get these results:
The one below was statically added, and it appears correctly. The one above generated dynamically, but it appears only as a check box. So my question is, how do I solve this?
After looking at the documentation I did find somehting that worked.
I need to first add the code to the actual elment that will contain the switch.
Only after the code is added I can enable switchery using these two lines, copied and pasted from the documentantion
Hope this helps someone else!