I need to implement a basic Checkbox Toggle element in Visualforce:

<div class="slds-form-element">
  <label class="slds-checkbox_toggle slds-grid">
    <span class="slds-form-element__label slds-m-bottom_none">Toggle Label</span>
    <input type="checkbox" name="checkbox-toggle-20" value="checkbox-toggle-20" 
      aria-describedby="checkbox-toggle-20" checked="" />
    <span id="checkbox-toggle-20" class="slds-checkbox_faux_container" 
      <span class="slds-checkbox_faux"></span>
      <span class="slds-checkbox_on">Enabled</span>
      <span class="slds-checkbox_off">Disabled</span>

However, I need to conditionally disable it based on a merge value. With HTML elements, the mere existence of the disabled attribute disables the input--it doesn't matter what the value of the attribute is.

How can I conditionally add the disabled attribute on a native HTML element?

Note: I was able to get around my issue by using an apex:inputCheckbox element (despite the docs using a native HTML element), but I'd still like to know if there's a way to do this.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.