1

I am developing my first CRUD in the SharePoint Framework. I am not using any javascript framework, just jQuery. The approach works fine outside of the framework. When the program tries to post via an ajax REST call it throws an error. The error is 403 Forbidden and the full error message is "The security validation for this page is invalid and might be corrupted."

Here is the ajax code

fullUrl = siteContext.siteURLSP + siteContext.urlJobTicketsId + jobActivity;
var ajaxData ={
    '__metadata': {'type': 'SP.Data.JobTicketsListItem'},                       
    'Notes' : jQuery("#inputNotes").val(),
    'Completed_x0020_ByStringId': siteContext.currentUser,
    'Completed': today.toISOString()
    }


jQuery.ajax({
        url: fullUrl,
        type: "POST",
        data: JSON.stringify(ajaxData),
        headers: {
            "accept":       "application/json;odata=verbose",
            "content-type": "application/json;odata=verbose",
            "X-RequestDigest" : jQuery("#__REQUESTDIGEST").val(),
            "IF-MATCH": "*",
            "X-HTTP-Method": "MERGE",
        },
        success: onActivityCompletedSuccess,
        error: function(jqXHR, status, error){
            console.log(jqXHR);
            console.log("status="+ status);
            console.log("error=" + error)
            onJobTicketsFailed(jqXHR, status, error);
        }
});

I am suspecting it may have something to do with the REQUESTDIGEST variable but I can't verify that it is the cause. Any help would be greatly appreciated.

Thanks!

1
  • That all looks correct-ish to me. Is this for creating an item or updating an existing one? I recently had this problem and I think it was because I didn't include the Title and it was a required column. You can also refresh the digest by including this call before your ajax call UpdateFormDigest(_spPageContextInfo.webServerRelativeUrl, _spFormDigestRefreshInterval).
    – Rothrock
    May 11, 2017 at 0:17

1 Answer 1

2

The __REQUESTDIGEST hidden field is not available in the SharePoint Framework which is why your request is failing. Instead of trying to retrieve it from the page, you should retrieve it from SharePoint by issuing an AJAX request to /_api/contextinfo (https://github.com/SharePoint/sp-dev-fx-webparts/blob/b63fd893093f90142d4f384cfab3da49d3c1fa6d/samples/angular-multipage/src/webparts/poll/app/services/PollService.ts#L138-L155. While this snippet is based on AngularJS, the principle is the same in jQuery).

Since you're building a SharePoint Framework web part, you should consider using use the standard SPHttpClient which automatically retrieves the request digest for you. For more information see the code sample at https://github.com/SharePoint/sp-dev-fx-webparts/blob/master/samples/sharepoint-crud/src/webparts/noFrameworkCrud/NoFrameworkCrudWebPart.ts.

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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