Custom Grid/Subgrid Using Office-UI-Fabric DetailsList

Custom PCF Grid/Subgrid Using Office-UI-Fabric DetailsList

DetailsList Grid Control

Allows you to simulate the out of the box Grid and Subgrid controls using the Office-UI-Fabric DetailsList control. It was built to provide a springboard when you need a customizable grid experience. This component re-creates a mojority of the capabilities available out of the box in less than 300 lines of code and demonstrates the following:

  • Using the DataSet within a React functional component.
  • Displaying and sorting data within the Office-UI-Fabric DetailsList component.
  • Rendering custom formats for data with the DetailsList component such as links for Entity References, email addresses, and phone numbers.
  • Displaying field data for related entities.
  • React Hooks - the component uses both useState and useEffect.
  • Loading more than 5k records in DataSet.
  • Retaining the use of the standard ribbon buttons by using the setSelectedRecordIds function on the DataSet.
  • Detecting and responding to control width updates.


  1. I see for certain resolutions, on scrolling the grid turns blank. Is it a known issue with your control and any fix available?

  2. Great job for publishing such a nice article. Your article isn’t only useful but it is additionally really informative. Thank you because you have been willing to share information with us. Non Woven Fabric Manufacturer in India

  3. Great tutorial, I liked the representation and explanation. Find help related to office products and quality tutorials at Www.Office.Com/Setup.

  4. Thanks for sharing this article here about the Buy Cotton Fabric Online . Your article is very informative and I will share it with my other friends as the information is really very useful. Keep sharing your excellent work.Buy Cotton Fabric Online in India

  5. Going down to the neighborhood police headquarters and getting a crime percentage report can serve to rapidly dispose of a couple of office rental areas that you may have had your heart set on. del mar office space

  6. I generally want quality content and this thing I found in your article. It is beneficial and significant for us. Keep sharing these kinds of articles, Thank you. burlap bags for sale

  7. I read the above article and got some knowledge from your article which is about burlap fabric. It's actually great and useful data for us. Thanks for sharing it.

  8. Experts can sort out and pack your stuff in a viable way. Then again, in the event that you pack your stuff yourself, you will face the challenge of harming your significant things.removals company hackney wick


Post a Comment

Popular posts from this blog

Add User As Local Administrator On Domain Controller

An error occurred while applying security information to

Horizontally Scroll A Large Power Apps Gallery