+ Start a Discussion
Big EarsBig Ears 

force:recordEdit - How are we supposed to use/style it?

Dear all,

The Lightning Component reference contains a component called "force:recordEdit" which allows the developer to put en edit page for a record in place. However, it is unstyled and ugly. Is there best practice guidance on how/whether it is supposed to be wrapped in particular divs/classes, etc?

If I inspect the individual input fields / labels / markup etc. that gets rendered, I can see that a lot of the usual CSS classes are included, but don't seem to be having an effect on how the field is rendered.

A field in force:recordEdit looks like this:
User-added image

I'd like it to look like this:
User-added image

I've tried wrapping it in the SLDS class, but the classes in the force:recordEdit component don't seem to exist in SLDS, so that can't be the right source.

Any help appreciated.
Andy
 
Best Answer chosen by Big Ears
Aabhi BattaAabhi Batta
Hello ,

These are the standard functionalities which we can't edit . I had tried earlier with no results .

Thanks 
Abhi Batta

All Answers

Aabhi BattaAabhi Batta
Hello ,

These are the standard functionalities which we can't edit . I had tried earlier with no results .

Thanks 
Abhi Batta
This was selected as the best answer
Big EarsBig Ears

Abhi,

Thank you for responding. What did you end up doing, just re-creating the forms manually?

Andy

Angelo RendonAngelo Rendon
I am also experiencing this issue. Andy, were you able to come up with something besides create a custom page?

- Angelo
Angelo RendonAngelo Rendon
Edit: I wrapped my force:recordEdit component in a div with an SLDS class and the styling was indeed changed. In what configuration are you using the component?

- Angelo
Big EarsBig Ears
Angelo - I wrapped the component in SLDS, but the styling still wasn't quite right as the classes on that component don't actually appear within the SLDS framework. I've created an idea on the idea exchange to try and get this resolved:

https://success.salesforce.com/ideaView?id=0873A000000E3tTQAS