How do I make a field read only using code in APEX and LWC?

Question

So basically I want to make a field of an object Read only given some conditions. For example, lets say I have a field called "Description" and an object called Account. Account also has a field called "Class", and lets say I want description to be read only when "Class" is Vard.

I would assume that you would have to import an APEX METHOD into LWC with the METHOD LIKE THIS:

SELECT Description, Class FROM Account WHERE Class ='Vard'

This would select all the description where class is = Vard, but then how would I make this field read only?

Answer 1

Since you are asking for a page layout here is a solution that I have used. However, it's not using APEX or LWC but it may be what you're looking for.

1. Create another Record Type for Account and assign a new page layout to it.
2. On this page layout you make the Class__c field Read-Only. I will use the Owner field from my sandbox since I don't have a Class__c field on the Account object.

Once you save the field properties the field will appear with a lock next to it to indicate that it's read-only for that page layout.

3. Create a workflow rule or add to a process builder. IF Class ='Vard' then update Record Type.

Here is an example in a Process Builder. Below we are setting the criteria. Remember it has to be for every time a record is created and edited. The same would go for a Workflow Rule.

Next we are changing the Record Type of that record using the Update Field Action.

If the Class field gets changed to "Vard" the process builder is going to kick in and update the Record Type for that record.

As a result, it will change the page layout associated to that Record Type.

Answer 2

If you need the field to be read-only on the record's standard page layout, I can see an argument for using @SFAdmin's answer.

But if you're building a Lightning Web Component anyway -- i.e. you are already taking the plunge and doing custom code instead of configuration for the UI where you want the Description field to be read-only -- implementing this in LWC is pretty straightforward. You just set the disabled (or if you prefer, read-only) attribute on the Description field to a getter that returns whether the class is "Vard".

HTML Template

<template>
    <lightning-input 
        label="Description" 
        data-field="description"
        value={description}
        disabled={classIsVard}
        onchange={handleChange}
    ></lightning-input>
    <lightning-input 
        label="Class" 
        data-field="classField"
        value={classField}
        onchange={handleChange}
    ></lightning-input>
</template>

JavaScript Controller

import { LightningElement, track, api } from 'lwc';

export default class App extends LightningElement {
    @track description;
    @track classField;

    handleChange(event) {
        this[event.target.dataset.field] = event.target.value;
    }

    get classIsVard() {
        return this.classField === 'Vard';
    }
}