CODEWITHSUNDEEP
reactjssharepointspfxsharepoint-listpnp-js
Hasnain Ali
Hasnain Ali

Reputation: 1

Get data from another sharepoint list while we store id in my current list?

I have a category list in SharePoint which have all categories in my list:

enter image description here

While it is sub-category list which has all sub-categories

enter image description here

And I also have third list which have items and the respective category and sub-category IDs:

enter image description here

I have to develop a webpart in SPFx which renders all the categories and under the category it should have 3 columns for sub-category and under each sub-category it renders the items related to that category.

UI of Web Part that I have to build

enter image description here

How to build this webpart? I am using SPFX with React and PnP SP for APIs kind of things.

I am not sure how to get data from all of the list and do the joins to get data from a different lists.

Upvotes: 0

Views: 690

Answers (1)

Zehui Yao
Zehui Yao

Reputation: 107

Since the technology I specialize in is the Microsoft Graph API, so, the solution I can provide is to use the below endpoints of the Microsoft Graph, which supports for getting data from SharePoint lists, creating new lists or columns and creating new items or updating items in lists.

Here are some documentations for your reference:

https://learn.microsoft.com/en-us/graph/api/resources/sharepoint?view=graph-rest-1.0

https://learn.microsoft.com/en-us/graph/api/list-get?view=graph-rest-1.0&tabs=http

Access lists and items

GET /sites/{site-id}/lists/{list-id}

GET /sites/{site-id}/lists/{list-id}/items

Create a new item in a list

POST /sites/{site-id}/lists/{list-id}/items

Update listItem

PATCH /sites/{site-id}/lists/{list-id}/items/{item-id}

Create a new list

POST /sites/{site-id}/lists

Create a columnDefinition in a list

POST /sites/{site-id}/lists/{list-id}/columns

To use the graph Api, you first need to authenticate and acquire a token, which contains the permissions required to use a specific endpoint, and you need to register your app in AD partial and add permissions to it.

You can refer to the official documentation to follow the complete guidance.

Hope this helps. If you need any more help, please feel free to comment below. Best Wishes.

Upvotes: 0

Related Questions