Hide and disable Delete and Submit button based on condition

[KG360]

In a report details page, I need to allow only the record creator to make changes to and delete the record. Other users belonging to the same account can view the record. This is [partly] achieved through disabling fields in the report details page for users who have not created the record.

The issue is that any user can hit 'Delete' and erase the record. 

How do I hide and disable both the Delete and the Submit buttons? The condition is: Current user ID != the record user ID.

As always - appreciate any guidance on this!

KG

 

[ParkLoey]

Hi! Looks like this needs some JavaScript. I haven't found any that specifically does what you are trying to achieve but you can still give it a try.

Here are some that I think might help:

 

[CoopperBackpack]

Hello @KG360,

As far as I understood, in the table, you have a field to store the ID of the user who submitted this record. 

1) If it is a stand-alone Details page, it is possible to remove the whole container with buttons. 

If the buttons are hidden and disabled, it is possible to enable them and make them visible through the browser`s console. 

So, it is more secure to remove the element from the page.

This script should be added to the Footer of the Details page. 

<script>
document.addEventListener('DataPageReady', hideButtonsHandler)
   
function hideButtonsHandler(){

    const curentUser = '[@authfield:ID]'; 
    const submittedBy = '[@field:submitted_by]';
    const btnsContainer = document.querySelector('.cbBackButtonContainer');

    if(curentUser !== submittedBy) {
         btnsContainer.remove();
     }
document.removeEventListener('DataPageReady', hideButtonsHandler)  
}
</script>

In this script, please replace the parameters. 

In my example, the field name from the table where the user's ID is stored is named 'submitted_by'. 

And the user ID from the Authentication is named 'ID'.

You may use an 'insert' button to add the field names:

2) If the Details page is a part of the Report (Tabular,  Gallery, List) DataPage, then the container with buttons includes the 'Back' button.

In this case, it is possible to remove the 'Update' and the 'Delete' buttons and not the whole container with the buttons. 

<script>
document.addEventListener('DataPageReady', hideButtonsHandler)
   
function hideButtonsHandler(){

    const curentUser = '[@authfield:ID]';
    const submittedBy = '[@field:submitted_by]';
    const updateButton = document.querySelector('.cbUpdateButton');
    const deleteButton = document.querySelector('.cbDeleteButton');

    if(curentUser !== submittedBy) {
         updateButton.remove();
         deleteButton.remove();
     }
document.removeEventListener('DataPageReady', hideButtonsHandler)  
}

</script>

Feel free to update the thread if you have questions. 

[KG360]

Fabulous @CoopperBackpack, and very good catch on the Back button. I will try both solutions. /KG