[SalesForce] Lightning Component output form styling

I'm trying to develop a lightning component which represents an output form. That is, instead of having input boxes, I just want the lightning text with the underline below and the label on top.

So far I've checked the ui:outputText, lightning:formattedText, and a few other components and I can't seem to find a way to display what I want without having to write the HTML myself with using SLDS classes.

What's the best approach for creating such an output form given that the data will not be coming from Salesforce Objects but from a JSON from a remote call?

Best Answer

Unfortunately, you'll have to write some of the styling yourself. Avoid the ui:* namespace elements, as they are only there to provide basic HTML-level functionality wrapped up in some basic formatting. There's no generic equivalent to apex:pageBlock/apex:pageBlockSection/apex:pageBlockSectionItem, so you'll need to use the lightning:formatted* elements wrapped up with the outer-level styling needed to get the appearance you're looking for, or perhaps even just write a single component that wraps up an entire form element, plus one more for the form layout.

Related Topic