2

How to disable inline Edit for certain profiles.

      <lightning:datatable 
                         keyField="Id" 
                         aura:id="subscriberTable" 
                         data="{! v.data }" 
                         columns="{! v.columns }" 
                         hideCheckboxColumn="true" 
                         showRowNumberColumn="false" 
                         initialRows="{! v.recordsToDisplay}" sortedBy="{! v.sortedBy }" 
                         sortedDirection="{! v.sortedDirection }" 
                         onsort="{! c.updateColumnSorting}" 
                         draftValues="{! v.draftValues }" 
                         onsave="{! c.handleSaveEdition }" />
</div>

Js side:

     component.set('v.columns', [{
            label: 'Name',
            fieldName: 'Name',
            type: 'text',
            sortable: true
        },
        {
            label: 'Alias',
            fieldName: 'Alias__c',
            type: 'text',
            sortable: true
        },
        {
            label: 'Point of Contact(Email)',
            fieldName: 'Email__c',
            type: 'text',
            sortable: true,
            editable: true
        },
        {
            label: 'Active',
            fieldName: 'Active__c',
            type: 'boolean',
            sortable: true,
            editable: true
        },
        {
            label: 'Portal Access',
            fieldName: 'Portal_Access__c',
            type: 'boolean',
            sortable: true,
            editable: true,

        },


    ]);

How to set "Active" field editable to false for these 2 profiles (Test1,Test2).In normal Table we can use aura:if but Iam not sure how to do this here.

//I have tried this approach but it works but a lot of code

JS side:

  helper.userEditAccess(component,event,helper);

Helper:

   userEditAccess: function(component, event, helper) {
    var action = component.get("c.canUserEdit");
    action.setCallback(this, function(a) {
        var state = a.getState();
        if (state === 'SUCCESS') {
            if (a.getReturnValue() == true) {
                component.set('v.columns', [{
                        label: 'Name',
                        fieldName: 'Name',
                        type: 'text',
                        sortable: true
                    },
                    {
                        label: 'Alias',
                        fieldName: 'Alias__c',
                        type: 'text',
                        sortable: true
                    },
                    {
                        label: 'Point of Contact(Email)',
                        fieldName: 'Email__c',
                        type: 'text',
                        sortable: true,
                        editable: true
                    },
                    {
                        label: 'Active',
                        fieldName: 'Active__c',
                        type: 'boolean',
                        sortable: true,
                        editable: false
                    },
                    {
                        label: 'Portal Access',
                        fieldName: 'Portal_Access__c',
                        type: 'boolean',
                        sortable: true,
                        editable: false,

                    },


                ]);
            } else if (a.getReturnValue() == false) {
                component.set('v.columns', [{
                        label: 'Name',
                        fieldName: 'Name',
                        type: 'text',
                        sortable: true
                    },
                    {
                        label: 'Alias',
                        fieldName: 'Alias__c',
                        type: 'text',
                        sortable: true
                    },
                    {
                        label: 'Point of Contact(Email)',
                        fieldName: 'Email__c',
                        type: 'text',
                        sortable: true,
                        editable: true
                    },
                    {
                        label: 'Active',
                        fieldName: 'Active__c',
                        type: 'boolean',
                        sortable: true,
                        editable: true
                    },
                    {
                        label: 'Portal Access',
                        fieldName: 'Portal_Access__c',
                        type: 'boolean',
                        sortable: true,
                        editable: true,

                    },


                ]);
            }
        } 
    });
    // enqueue the action 
    $A.enqueueAction(action);
}

Apex class:

@AuraEnabled(cacheable=true)
public static Boolean canUserEdit() {
    List<string>profileNameList=new List<string>();
    List<user>userList=[SELECT ID,PROFILE.NAME,PROFILE.Id FROM USER where profile.name='Test-Admin'];
    for(User us:userList){
        profileNameList.add(us.PROFILE.Id);
    }
    Id profileId = UserInfo.getProfileId();
    if(profileNameList.contains(profileId)){
        return true;
    }else{
        return false;
    }
}
1
  • Assign a custom permission to both profiles check whether the user has custom permission or not during init of component based on that set editable "true" or "false" – User6670 Mar 19 '20 at 13:42
2

With the usage of Apex

Assuming this is your Controller:

public class TestController {

    public  static final Set<Id> EDIT_ALLOWED_PROFILE_IDS = new Set<Id> {
        '00e2o000001XMNaAAO',
        '00e2o000001XMNaBCS'
    };

    @AuraEnabled(cacheable=true)
    public static Boolean canUserEdit() {
        Id profileId = UserInfo.getProfileId();
        return EDIT_ALLOWED_PROFILE_IDS.contains(profileId);
    }
}

EDIT_ALLOWED_PROFILE_IDS can be of course initialized via Custom Settings, Custom Metadata and so on.

Then use this method in your JS code and assign its result to the editable property.

LWC version

HTML:

<template>
    <div style="height: 300px;">
        <lightning-datatable
                key-field="id"
                data={data}
                show-row-number-column
                row-number-offset={rowOffset}
                suppress-bottom-bar
                columns={columns}>
        </lightning-datatable>
    </div>
</template>

JS:

import { LightningElement, wire, track } from 'lwc';
import canUserEdit from '@salesforce/apex/TestController.canUserEdit';

const columns = [
    { label: 'Label', fieldName: 'name'},
    { label: 'Website', fieldName: 'website', type: 'url'},
    { label: 'Phone', fieldName: 'phone', type: 'phone'},
    { label: 'CloseAt', fieldName: 'closeAt', type: 'date'},
    { label: 'Balance', fieldName: 'amount', type: 'currency'}
];

export default class TestLwcComponent extends LightningElement {

    connectedCallback() {
        canUserEdit()
            .then(result => {
                this.columns.forEach(function (item, index) {
                    item.editable = result
                });
                this.columns = [...this.columns];
            })
            .catch(error => {
                console.log(error);
            })
        this.data = [
            {
                "name":"Maddison Emard",
                "email":"Aiyana61@hotmail.com",
                "website":"https://jennings.org",
                "amount":"134.01",
                "phone":"803.854.4656 x4777",
                "closeAt":"2020-04-22T22:31:35.941Z",
                "id":"1baf5e28-f839-4ddd-84ee-e71f0bcca59d"
            },
            {
                "name":"Lilla Stamm",
                "email":"Rebeka95@gmail.com",
                "website":"http://princess.net",
                "amount":"306.11",
                "phone":"1-753-685-9600 x9132",
                "closeAt":"2020-05-29T10:20:59.730Z",
                "id":"4d38f892-0c6e-42c1-beb3-a41faae1c501"
            },
            {
                "name":"Pauline Labadie",
                "email":"Santos_Grady@gmail.com",
                "website":"https://mafalda.name",
                "amount":"57.54",
                "phone":"860.982.3835 x2136",
                "closeAt":"2021-01-08T23:48:57.409Z",
                "id":"ad225ea1-8a64-4a05-99e9-bba42c865d45"
            }
        ];
    }

    @track columns = columns;
    @track data = [];
    @track rowOffset = 0;
}

Aura version

Component:

<aura:component controller="TestController" implements="flexipage:availableForAllPageTypes">
    <aura:attribute name="data" type="Object"/>
    <aura:attribute name="columns" type="List"/>
    <aura:attribute name="errors" type="Object" default="[]"/>
    <aura:attribute name="draftValues" type="Object" default="[]"/>

    <aura:handler name="init" value="{! this }" action="{! c.init }"/>

    <div class="slds-p-around_medium">
        <h1 class="slds-text-heading_large">Inline edit playground</h1>
    </div>

    <div style="height: 300px">
        <lightning:datatable
            columns="{! v.columns }"
            data="{! v.data }"
            keyField="id"
            errors="{! v.errors }"
            draftValues="{! v.draftValues }"
        />
    </div>
</aura:component>

Controller:

({
    init: function (cmp, event, helper) {
        var action = cmp.get("c.canUserEdit");
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                var canEdit = response.getReturnValue();
                cmp.set('v.columns', [
                    { label: 'Label', fieldName: 'name', editable: canEdit},
                    { label: 'Website', fieldName: 'website', type: 'url', editable: canEdit},
                    { label: 'Phone', fieldName: 'phone', type: 'phone', editable: canEdit},
                    { label: 'CloseAt', fieldName: 'closeAt', type: 'date', editable: canEdit},
                    { label: 'Balance', fieldName: 'amount', type: 'currency', editable: canEdit}
                ]);
            } else if (state === "ERROR") {
                var errors = response.getError();
                if (errors) {
                    if (errors[0] && errors[0].message) {
                        console.log("Error message: " + errors[0].message);
                    }
                } else {
                    console.log("Unknown error");
                }
            }
        });
        $A.enqueueAction(action);

        cmp.set('v.data', [
            {
                "name":"Maddison Emard",
                "email":"Aiyana61@hotmail.com",
                "website":"https://jennings.org",
                "amount":"134.01",
                "phone":"803.854.4656 x4777",
                "closeAt":"2020-04-22T22:31:35.941Z",
                "id":"1baf5e28-f839-4ddd-84ee-e71f0bcca59d"
            },
            {
                "name":"Lilla Stamm",
                "email":"Rebeka95@gmail.com",
                "website":"http://princess.net",
                "amount":"306.11",
                "phone":"1-753-685-9600 x9132",
                "closeAt":"2020-05-29T10:20:59.730Z",
                "id":"4d38f892-0c6e-42c1-beb3-a41faae1c501"
            },
            {
                "name":"Pauline Labadie",
                "email":"Santos_Grady@gmail.com",
                "website":"https://mafalda.name",
                "amount":"57.54",
                "phone":"860.982.3835 x2136",
                "closeAt":"2021-01-08T23:48:57.409Z",
                "id":"ad225ea1-8a64-4a05-99e9-bba42c865d45"
            }
        ]);
    }
});

Without the usage of Apex

Aura version

Instead of the Apex controller, you can use a Lightning Data Service.

Component:

<aura:component controller="TestController" implements="flexipage:availableForAllPageTypes">
    <aura:attribute name="data" type="Object"/>
    <aura:attribute name="columns" type="List"/>
    <aura:attribute name="errors" type="Object" default="[]"/>
    <aura:attribute name="draftValues" type="Object" default="[]"/>

    <aura:attribute type="String" name="permittedProfiles" default="{!join('','00e2o0000022wBLAAY,', '00e2o000001XMNaBCS')}"/>

    <aura:attribute name="currentUser" type="User" />
    <force:recordData
        fields="Name, Email, UserType, ProfileId"
        recordId="{!$SObjectType.CurrentUser.Id}"
        targetFields="{!v.currentUser}"
        mode="VIEW"
        recordUpdated="{!c.handleRecordUpdated}"
    />

    <aura:handler name="init" value="{! this }" action="{! c.init }"/>

    <div class="slds-p-around_medium">
        <h1 class="slds-text-heading_large">Inline edit playground</h1>
    </div>

    <div style="height: 300px">
        <lightning:datatable
            columns="{! v.columns }"
            data="{! v.data }"
            keyField="id"
            errors="{! v.errors }"
            draftValues="{! v.draftValues }"
        />
    </div>
</aura:component>

Controller:

({
    init: function (cmp, event, helper) {
        cmp.set('v.data', [
            {
                "name":"Maddison Emard",
                "email":"Aiyana61@hotmail.com",
                "website":"https://jennings.org",
                "amount":"134.01",
                "phone":"803.854.4656 x4777",
                "closeAt":"2020-04-22T22:31:35.941Z",
                "id":"1baf5e28-f839-4ddd-84ee-e71f0bcca59d"
            },
            {
                "name":"Lilla Stamm",
                "email":"Rebeka95@gmail.com",
                "website":"http://princess.net",
                "amount":"306.11",
                "phone":"1-753-685-9600 x9132",
                "closeAt":"2020-05-29T10:20:59.730Z",
                "id":"4d38f892-0c6e-42c1-beb3-a41faae1c501"
            },
            {
                "name":"Pauline Labadie",
                "email":"Santos_Grady@gmail.com",
                "website":"https://mafalda.name",
                "amount":"57.54",
                "phone":"860.982.3835 x2136",
                "closeAt":"2021-01-08T23:48:57.409Z",
                "id":"ad225ea1-8a64-4a05-99e9-bba42c865d45"
            }
        ]);
    },
    handleRecordUpdated: function(cmp, event, helper) {
        var permittedProfilesAttribute = cmp.get('v.permittedProfiles');
        var permittedProfilesArray = permittedProfilesAttribute.split(',');
        var eventParams = event.getParams();

        if(eventParams.changeType === "LOADED") {
            var currentUser = cmp.get('v.currentUser');
            var canEdit = permittedProfilesArray.includes(currentUser.ProfileId);

            cmp.set('v.columns', [
                { label: 'Label', fieldName: 'name', editable: canEdit},
                { label: 'Website', fieldName: 'website', type: 'url', editable: canEdit},
                { label: 'Phone', fieldName: 'phone', type: 'phone', editable: canEdit},
                { label: 'CloseAt', fieldName: 'closeAt', type: 'date', editable: canEdit},
                { label: 'Balance', fieldName: 'amount', type: 'currency', editable: canEdit}
            ]);
        }
    }
});

The examples above are based on Datatable Example: Data Table With Inline Edit from LWC Docs and Aura Docs.

7
  • Thanks got it. without apex any work arround?? – Annappa Mar 19 '20 at 15:27
  • @AnnappaPH added LWC component utilizing Apex code to my answer. Why not using Apex? – Przemysław Tamoń Mar 19 '20 at 15:51
  • I will agree with your solution. no comments.but iam looking for anyother work arround? – Annappa Mar 20 '20 at 4:42
  • @AnnappaPH I believe there is, have a look at that link. I'll update my answer during the day with another working solution. – Przemysław Tamoń Mar 20 '20 at 7:20
  • thanks.Its lightning components – Annappa Mar 20 '20 at 8:17

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.