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 Sales Dynamics 365

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

Blogs
01 Oct, 2026

Catch Blocks That Actually Catch: Logging Failed Steps in Power Automate

Introduction Most teams building Power Automate flows eventually land on the same pattern: wrap your business logic in a Scope,…

READ MORE
Blogs
01 Oct, 2026

Automatically Refresh a PCF Dataset Grid After Closing a Custom Page in Dynamics 365

Introduction Custom Pages provide a modern way to edit records in Dynamics 365. A common approach is to open a…

READ MORE
Blogs
23 Sep, 2026

How to Dynamically Switch Business Process Flow When Changing Forms in Dynamics 365

How to Dynamically Switch Business Process Flow When Changing Forms in Dynamics 365 Introduction Microsoft Dynamics 365 provides powerful customization…

READ MORE