How can we help you today?

How to Display Content from a SharePoint List/Library Column in a Lightbox

When connecting ShortPoint Design Elements to a SharePoint list/library, users can map the Link field with the Item URL, Document Preview or other similar option to display the item/file/document details. 

It is also common to use a lightbox (popup) as a Linking option in that case.


 

Sometimes, you might want to get not all item's details, but a single column (for instance, the description). However, once you map Link field with this column, nothing happens when you click the link.



Items mappingPage view mode - clicking to open the link


With the help of REST API connection type, we can get the list column content and display it in a lightbox:



Please, follow the steps described in the article, if you are looking for this solution.


TABLE OF CONTENTS


Prerequisites

  • You have a SharePoint list/library view, that has a column with data you would like to display in a lightbox.
  • You have a ShortPoint Design Element, connected to that view.

Step 1: Prepare a separate page that will store the data from the SharePoint list/library column


To make this solution work, you need to prepare a new page, that will only store the data from a SharePoint list/library column. 

Please follow the guidelines from our solution article How to Display Content Based on the Query String Parameter.


Important

  1. Please do not restrict user access to this page as this will lead to data not displayed in the lightbox either. 
  2. The data in a lightbox will be displayed as a page with the page header. In case you don't like the page header, you may do the following:
  • Create a relevant page name (e.g., Announcement details), so the users will see it at the top, before the column details.
  • Hide it for all the pages in Theme Builder (Site contents > ShortPoint Dashboard > Theme Builder > Customize my site > General settings > Elements > All sites > Hide Header). Unfortunately, it is yet not possible to hide it only for one page.

Step 2: Update the connected Design Element with the Link to get data from the column


Navigate to the page where you have ShortPoint Design Element you wish to display data from a column in a lightbox. 

This Design Element should be connected to the same SharePoint list/library view as the page stores its data.


Important: Please, make sure that the view, to which you have connected your ShortPoint Design Element, has the ID column in it.


In this example we are using Simple Lists Design Element, but you may use any other Design Element that has a Link field.


Edit your page. Click the cog wheel icon to open your ShortPoint Design Element settings



The Settings tab will open.


Switch to the Items tab.



Copy the following URL:


https://page_that_stores_data_URL.aspx?itemID=#ID


Substitute https://page_that_stores_data_URL.aspx with the page URL, we have created in Step 1 to store the data.


In our example it will look like this:


https://mycompany.sharepoint.com/SitePages/Storing-data-page.aspx?itemID=#ID

where 

https://mycompany.sharepoint.com/SitePages/Storing-data-page.aspx is our storing page URL.


Paste the URL to the Link field:



Click Update, and save the page.



Result


That's it. Now when you click to open the link, you will see the text from the column of the SharePoint list/library.



Related articles:

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.

World's best intranet sites are designed using ShortPoint

Get started today! Learn more
See all 29 topics

Start a trial

Ignite your vision. Install ShortPoint directly on your site, or play in sandbox mode. No credit card required.

Get started today

World’s best intranet sites are designed using ShortPoint

Thousands of companies using ShortPoint everyday to design, brand and build award winning intranet sites.

Get started Learn more