Correct way of saving data to a page column from SPFx webpart while page is in edit mode

What type of issue is this?

Question

What SharePoint development model, framework, SDK or API is this about?

💥 SharePoint Framework

Target SharePoint environment

SharePoint Online

What browser(s) / client(s) have you tested

• [ ] 💥 Internet Explorer
• [ ] 💥 Microsoft Edge
• [ ] 💥 Google Chrome
• [ ] 💥 FireFox
• [ ] 💥 Safari
• [ ] mobile (iOS/iPadOS)
• [ ] mobile (Android)
• [x] not applicable
• [ ] other (enter in the "Additional environment details" area below)

Additional environment details

• browser version: all
• SPFx version: newest

Issue description

I am looking for a way to store data that a user enters into a SPFx web part while the page is in edit mode in a page column. A column because I want to query the data via search.

The process would be as follows:

• User edits the page
• Adds the WebPart
• Enters data into the web part
• Saves the page
• Data is saved in a column

I am aware that the data from a web part is saved in web part properties and that these properties can be made searchable. I can then also find results via the search. However, the data can only be found in the managed property “SPFxExtensionJson”, hidden in HTML and JSON. This is not a nice way to work with the data.

The APIs “ValidateUpdateListItem” and “/_api/sitepages/SavePage” are also known to me, but no longer really work in the new “collaboration mode”. Before this new mode, I could save data in the column via “ValidateUpdateListItem”, but this is overwritten as soon as the page is saved via the interface.

What I am looking for would be an API in the web part itself, for example a function like “onPageSave(oldValue, newValue)” which is executed as soon as the user saves the page via UI and as a web part developer you can still influence what is saved and insert data.

Or is there an other way to edit the list item of the page while the user is in edit mode?

Hello @diabhoil, Thank you for bringing this issue to our attention. We will look into it and get back to you shortly.

Hello @diabhoil , Another approach would be to use the Sharepoint Rest API, this involves making a Rest API call to update the column with the data entered in the web part. Let me know if this approach works or further help is required on the same. Thanks!!

We are closing this issue for now. If the problem persists, feel free to reopen it or open a new one.

Sorry for not respanding. I am not sure if you got my problem at all. I am aware of SharePoint Rest APIs and how they are work and so on. But my question is specific about doing changes from a SPFx webpart to the underlaying list item while working on the page in edit mode.

For example doing this call while the page is in edit mode wont work:

const url = `${this.context.pageContext.web.absoluteUrl}/_api/web/lists/getByTitle('Site Pages')/items(${this.context.pageContext.listItem?.id})`;
const result = await this.context.spHttpClient.post(url, SPHttpClient.configurations.v1, {
          body: JSON.stringify({
            MyCustomField: "Test"
          }),
          headers: [
            ['accept', 'application/json;odata=nometadata'],
            ['Content-type', 'application/json;charset=utf-8'],
            ['odata-version', '3.0'],
            ["if-match", "*"],
            ["x-http-method", "MERGE"]
          ]
        });

I will get a 423 locked status response with error code "-2147018894, Microsoft.SharePoint.SPException". So how do I submit changes to a field of the list item with this new "together mode"?

There is this Rest API call "SavePageCoAuth". But there is no documentation how to use this....

@diabhoil Thank You for clearing it up. We will look into it and get back to you shortly.

@diabhoil, thanks for the clarification. This behavior appears to be by design due to how modern page editing (Together Mode) handles co-authoring. When a page is in edit mode, the underlying list item is locked, and direct updates (via REST or ValidateUpdateListItem) are blocked or overwritten on save. Currently, there's no supported way to write to page columns from a web part during edit mode. We’ve noted this as a potential feature gap for internal review.