Saving data from a multi-page react app

Question

I am trying to emulate a sharepoint new form in a custom react app of multiple pages. My problem is how will I store the data that user enters across multiple pages and save it in the sharepoint list. Please let me know.

Answer 1

If your react app is hosted on sharepoint, you can use the rest interface:

function createListItem(siteUrl, listName, itemProperties, success, failure) {
    var itemType = listName + 'ListItem'; //may need additional substitution for some characters in listName
    itemProperties.__metadata = {
        "type": itemType
    };
    $.ajax({
        url: siteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items",
        type: "POST",
        contentType: "application/json;odata=verbose",
        data: JSON.stringify(itemProperties),
        headers: {
            "Accept": "application/json;odata=verbose",
            "X-RequestDigest": $("#__REQUESTDIGEST").val()
        },
        success: function (data) {
            success(data.d);
        },
        error: function (data) {
            failure(data);
        }
    });
}

You would call it like this (SPO example): createListItem('https://mycompany.sharepoint.com', 'MyList', { 'Title': 'MyNewListItem', 'MyAttribute': true }, successhandler, errorhandler)

Notice the X-RequestDigest in the header. That is only available on SP-Sites, where you are authenticated. You need write permissions for the list of course and operations are performed with that particular user.

If you are hosted elsewhere, you need to get an auth token first.