knowledgecenter-breadcrum

Knowledge Center

15 Mar, 2022

How to make a Detail List scrollable?

Posted on 15 Mar, 2022 by Admin, Posted in Dynamics 365 Dynamics-365 Sales

How to make a Detail List scrollable? Blogs

How to make a DetailList scrollable?

Introduction

Recently, we created a DetailList type of PCF control to display some data.

As this list was going to display hundreds of records, we couldn’t scroll through them as there was no scroller present.

Solution

After a bit of research we found that a scroller can be added by importing “ScrollablePane” component from Fluent UI library using the below command:

import { ScrollablePane, ScrollbarVisibility } from ‘office-ui-fabric-react’;

We add the ScrollablePane tag just above our DetailList tag as shown below.

After building the PCF control, now we can see that our list is scrollable.

Jan 2022 blog 2 gif

Links

Comment

This is a Required Field

Loading

Recent Updates

Thumbnail_top 10 benefits of
Blogs
02 Dec, 2024

Top 10 Benefits of Microsoft Dynamics 365

This blog lists the advantages of Microsoft Dynamics 365, focusing on how it can improve your business operations.    …

READ MORE
Thumbnail_Microsoft365 Vs D365
Blogs
12 Nov, 2024

Microsoft 365 vs Dynamics 365

This blog will help you understand the key difference between Microsoft 365 and Dynamics 365, so you can make an…

READ MORE
Thumbnail_What is Microsoft Dynamics 365
Blogs
05 Nov, 2024

What is Microsoft Dynamics 365?

This blog explores Microsoft Dynamics 365, a cloud solution for handling different business activities smoothly. The rising trends of competition…

READ MORE