3

Trying to create list item:

let data = new FormData();
data.append("__metadata", JSON.stringify({ "type": itemType }));
data.append("Title", 'newItemTitle');

return fetch(_spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items", {
    method: "POST",
    credentials: 'same-origin',
    body: data,
    headers: { 
        "Accept": "application/json; odata=verbose",
        "X-RequestDigest": $("#__REQUESTDIGEST").val()            
    }
}).then(
        response => response.json())
        .then( 
            (r: any) => r.d.results);
}

Got following error: 415 Unsupported Media Type

In Request Payload:

------WebKitFormBoundaryFSelaakwmV2hvl6e Content-Disposition: form-data; name="__metadata"

{"type":"SP.Data.MyListItem"} ------WebKitFormBoundaryFSelaakwmV2hvl6e Content-Disposition: form-data; name="Title"

newItemTitle ------WebKitFormBoundaryFSelaakwmV2hvl6e--




Meanwhile JQuery ajax request works fine: 201 Created

var item1 = {
    "__metadata": { "type": itemType1 },
    "Title": 'newItemTitle'
};

$.ajax({
    url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items",
    type: "POST",
    contentType: "application/json;odata=verbose",
    data: JSON.stringify(item1),
    headers: {
        "Accept": "application/json;odata=verbose",
        "X-RequestDigest": $("#__REQUESTDIGEST").val()
    },
    success: function (data) {
        var i = data;
    },
    error: function (data) {
        var i = data;
    }
});

Request Payload:

{"__metadata":{"type":"SP.Data.MyListItem"},"Title":"newItemTitle"}

Any ideas how Fetch could be used to create list item? I assume that Request Payload format has to be JQuery-like...



Update:

Thanks to wjervis here is working example:

var item = {
    'Title': 'newItemTitle'
};


return fetch(_spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items", {
    method: "POST",
    credentials: 'same-origin',
    body: JSON.stringify(item),
    headers: { 
        "Accept": "application/json; odata=nometadata",
        "Content-Type": "application/json;odata=nometadata",
        "X-RequestDigest": $("#__REQUESTDIGEST").val()            
    }
})
  • 1
    Are you in SharePoint Online or On Premise? If On Prem, do you have SP1 installed? If so, use JSON Light. You specify odata=nometadata, and you simply post the data for the fields. No need to specify the __metadata property. Not sure if it works with FormData though. – wjervis May 3 '17 at 16:48
  • Thanks for your responce! I use both Online and 2013SP1 editions. Updated initial question. – Chetvergov May 4 '17 at 12:13
  • 1
    Just realized, you're missing the content-type header: "content-type": "application/json; odata=nometadata" (or verbose, if you prefer it). It's in your ajax example, but not your fetch. – wjervis May 4 '17 at 12:16
  • Yes, that was the case! Thanks a lot! I suggest you post an answer to the original question and I'll mark it as an 'answer', If you wish so, of course... – Chetvergov May 4 '17 at 12:49
2

The content-type header is missing from your fetch request:

fetch(odataurl, {
    method: "POST",
    credentials: 'same-origin',
    body: JSON.stringify(body),
    headers: { 
        "Accept": "application/json; odata=nometadata", // or odata=verbose|minimalmetadata  (minimalmetadata is default if odata not specified)
        "Content-Type": "application/json; odata=nometadata", // or odata=verbose|minimalmetadata  (minimalmetadata is default if odata not specified)
        "X-RequestDigest": $("#__REQUESTDIGEST").val()            
    }
});

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.