Conditional Link in DataPage Header

[Peterson]

We have a details DataPage that includes information common to multiple authenticated users. We want to include an [EDIT] button in the header but only for certain authorized users. We control that access with a checkbox and the checkbox field is included in the view used for the authentications. I basically want to have either a link or a message explaining why they can't edit it.

<script type="text/javascript">
document.addEventListener('DataPageReady', function(event){
if("[@authfield:Editor^]" == "Yes"){
    <a href="https://domain.com/edit_page?id=[@id]">EDIT</a>;
}
else{
    <span>Only authorized employees are allowed to edit their company information.</span>;
}
});
</script>

 

The EDIT link does not show up on my datapage where this Header is located. What am I missing?

[CoopperBackpack]

Hello @Peterson,

Please try the following:

1) Add the span or div element with the ID to the DataPage Header.

For example:

<span id='edit_link'></span>

 

2) Add this code to the DataPage Footer 

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

const linkElement = document.getElementById('edit_link'); //save the element form the Header to the variable

if("[@authfield:Editor^]" === "Yes"){
   linkElement.innerHTML = '<a href="https://domain.com/edit_page?id=[@id]">EDIT</a>'; //change the innerHTML property for the element
}
else{
    linkElement.innerHTML = '<span>Only authorized employees are allowed to edit their company information.</span>';
}
});
</script>  

 

Feel free to update this thread if you have any further questions.

 

[Kurumi]

Hi - sharing this new post!