I'm building a SharePoint SPFx react app. In a nutshell, the user fills out a form that I created. When the user hits submit, using PNPJs: https://pnp.github.io/pnpjs/sp/items/ I'm adding the item to a list called Request.

From there I send an email that contains the URL link to that item they created. Right now, my code adds the item to the list and I'm able to send an email with no problem. However, I want to get the ID of the item that was just added to the list, so that I can add it to the email.

Here is a striped down snippet of my function that adds items to the Request list.

async submitNewRequest():Promise<any> {

    let preprocessedData;

    try {       

        // add an item to the list
            Title: this.state.Title,
            Requestor_x0020_Email: this.state.getEmail,
            Created: this.state.startDate,

        }).then((iar) => {
            //Is this where I would get the ID 
        const emailProps: EmailProperties = {
            To: [this.state.getEmail],
            Subject: "Your court requisition has been submitted.",
            Body: this.initalMessage
    } catch(error) {


    return preprocessedData;            


I believe what I have to do is in the .then((iar) => { when item is successfully added to the list, to get a response back with that item ID. But I'm not sure how. In my const emailProps: EmailProperties is where I'm sending the email, which again works.

Typically I can do something like this await sp.web.lists.getByTitle("Request").items.getById(1).get(); and in the console I will get back something like this:

Title: "My title here"
Description: "Description Here"
ID: 24

Here is on submit function:

async _onNewRequest(event) {
    await this.submitNewRequest();

And lastly my email function:

get initalMessage() {
    return `<p>This is my email template that I stripped down.</p>
    <a href="https://mywebsite.sharepoint.com/sites/Requests/SitePages/Home.aspx#/MyRequests/'+ NEED_ID_HERE +'" target="_blank">
        Click Here

1 Answer 1


Based on their GitHub Page

as per your code you can use "iar.item" to get new list item details

    Title: "My Item Title"
}).then(r => {
    // this result will have two properties "data" and "item"
    // data is what was returned from SharePoint after the add operation
    // and item is an object of type item representing the REST query to that item
    // so you can immediately chain off that


    // this will add an attachment to the item we just created
    r.item.attachmentFiles.add("file.txt", "Here is some file content.");


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.