0

How can we apply slds to <ui:inputcheckbox>.I tried using <ui:inputcheckbox class="slds-checkbox" value=""/> but no hits.I want to style the checkbox as of SLDS. Also i am using other way around <lightning:input type="checkbox"/> which is styled as SLDS by default but i think due to beta version it is giving me following error.

This page has an error. You might just need to refresh it. Aura.loadComponent(): Failed to initialize application. An internal server error has occurred Error ID: 1853269181-216614 (1023342491)

  • 1
    Can you post the exact markup you tried to use for <lightning:input type="checkbox" />? We are using that component extensively without issues. – dsharrison Jun 16 '17 at 14:19
  • Just instead of using <ui:inputcheckbox> i was using <lightning:input type="checkbox" click="{!c.Change}"/> which returns me the error i posted. – Deepak Agarwal Jun 19 '17 at 9:12
  • If that is true, then you were missing required attributes. See developer.salesforce.com/docs/atlas.en-us.lightning.meta/… – dsharrison Jun 19 '17 at 14:37
1

Sometime you'll see that error when you are missing attributes. lightning:input requires name and label. Try:

<lightning:input type="checkbox" name="check1" label="Check Please" />

If you don't want a label, Summer '17 added a no label variant:

<lightning:input type="checkbox" name="check1" label="Check Please" variant="label-hidden" />
0

For applying SLDS styling try the following code with ui:inputCheckbox:

<div class="slds-form-element">
    <div class="slds-form-element__control">
        <label class="slds-checkbox">
            <ui:inputCheckbox value="" />
            <span class="slds-checkbox--faux" />
            <span class="slds-form-element__label">Checkbox</span>
        </label>
    </div>
    </div>

It will work for sure. If this helps mark it as best answer.

  • Dude i have got through that already.See in my answer post.I have different query.However thanks for your reply – Deepak Agarwal Jun 16 '17 at 8:41

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.