function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion

Don't want hyperlink on lightning:outputField

In a Community I am using a Lightning component with lightning:recordViewForm and lightning:outputField to display fields from existing Cases.

Two of the fields are lookups, AccountId and ContactId. They are rendered as hyperlinks, and if the user clicks either link they are taken to an Account or Contact page. We don't want this - we only want the Account Name and Contact Name to be displayed (with no hyperlink).

Is it possible to set some variant or property on the lightning:outputField for AccountID and ContactID to achieve this? Or do I need to go another route?

Thanks for any help!

<aura:component implements="force:hasRecordId,forceCommunity:availableForAllPageTypes" access="global">   
    <lightning:card title="Case Detail" iconName="standard:case">
        <p class="slds-p-horizontal_small">
        <lightning:recordViewForm recordId="{!v.recordId}" objectApiName="Case">
              <!--<div class="slds-grid full forcePageBlockSectionRow">-->
              <div class="slds-grid slds-gutters">
                  <!--<div class="slds-col slds-size_1-of-2">-->
                  <div class="slds-col">
                    <!--<lightning:outputField fieldName="AccountId" variant="label-hidden"/>-->
                    <lightning:outputField fieldName="AccountId"/>
                    <lightning:outputField fieldName="ContactId"/>                    
                <div class="slds-col">
                <!--<div class="slds-col slds-size_1-of-2">-->
                    <lightning:outputField fieldName="Organization_Id__c"/>
                    <lightning:outputField fieldName="HowManyUsersImpacted__c"/>

            <div class="slds-theme_default">
                <lightning:outputField fieldName="Client_Ref__c"/>  
                <lightning:outputField fieldName="Workaround_In_Place__c"/>	
                <lightning:outputField fieldName="Description"/>
                <lightning:outputField fieldName="Error_Message__c"/>
                <lightning:outputField fieldName="Steps_to_Reproduce__c"/>

According to the documentation on, lightning:outputField, a Lookup field will display as text only with no link.

Lookup: Displays a relationship between two records, for example, the account ID associated to a contact record. Lookups render as text only. Linking and hover overlays on lookup values are not supported.

Either I am misinterpreting the documentation, or something else is wrong. The above code displays both AccountID and ContactID as clickable links, and when clicked the generic Record Detail page opens.
Ajay K DubediAjay K Dubedi
Hi AndrewNerney,

You Can use the style attribute to remove the hyperlink?  Try this:
<apex:outputField id="CaseField3" value="{!Case.AssetId}" style="color:black;text-decoration:none;cursor:default" />
I hope you find the above solution helpful. If it does, please mark as Best Answer to help others too.
Ajay Dubedi
Hi Ajay,

Thanks for the response. I'll look further into using the style tag. But I am using lightning:outputField inside a lightning:recordViewForm wrapper, so apex:outputField won't work. I added the style attribute as you suggested but it has no effect:
<lightning:outputField fieldName="AccountId" style="color:black;text-decoration:none;cursor:default" />

This still renders as a clickable link.

In the meantime I have worked around this issue by cloning the Customer Community Plus profile that we were using and then setting Account and Contact objects to Read Only for the new profile. The user can still click on those links but they can't do any damage.