How to Remove Hyperlink from Lookup Columns in SharePoint?

Problem:
When we add a lookup column to any SharePoint list, it appears with the link to the parent item in SharePoint list views. The end-user often clicks on the lookup link and mistakenly edits the parent lookup item! People get confused about which link to click. So, we wanted to remove hyperlinks from lookup columns in SharePoint 2013 list views.

SharePoint 2013 remove hyperlink from lookup column – No code solution:

Here is how to remove hyperlinks from lookup fields out-of-the-box without any coding and customization efforts.

• Go to your list settings, pick the lookup column. In my case, it’s “Parent Project”. On the “Edit Column” page, select the “Title” field under the “Add a column to show each of these additional fields” Section as highlighted below.
• Now, edit your list view, unselect the “Parent Project” field, and select the “Parent Project: Title” field. (You can rename this Title – BTW!)

  

• Click “OK” to save the view. That’s all! This removes the link from hyperlink columns.

  

However, the Display form of the list still shows links in hyperlink fields, isn’t it? Proceed with the below method to remove hyperlinks from the lookup column. Although lookup field links can be removed using SharePoint designer-XSLT methods, I prefer this jQuery as it’s relatively simpler.

Using jQuery to remove hyperlink from lookup column:

Lookup columns are pointing to link something like “https://Site/***&RootFolder=*”. So, let’s find all Anchor elements of the page with HREF attribute “&RootFolder=*”. And remove the link of the lookup.

To remove lookup hyperlink from SharePoint list view using jQuery, follow these steps:

1. Go to your List view page, E.g. https://portal.crescent.com/Lists/ProjectMilestones/AllItems.aspx
2. Click on Site Settings gear, click on the “Edit Page” menu item
3. Click on Add a Web Part link shown on the page, Under “Media and Content” choose “Script Editor” and click on the “Add” Button
4. Click on the “Edit Snippet” link on the Script Editor Web part and place the below code in it and save the page.

   

<script type="text/javascript" src="https://code.jquery.com/jquery-1.2.6.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('a[href*="RootFolder=*"]').each(function(index) {
            var link = $(this);
            $(this).after("<span>" + link.text() + "</span>");
            $(this).remove();
        });
    });
</script>

$('a[href*="userdisp.aspx?ID="]').each(function(index) {