1

I am trying to create a new choice (radio buttons) field using REST API request in my SharePoint Online environment and this is the code I'm using:

$.ajax({
url: "https://mydomain.sharepoint.com/sites/mysite/mysubsite/_api/contextinfo",
method: "POST",
headers: { "Accept": "application/json; odata=verbose" },
success:function(data){
    var digest = data.d.GetContextWebInformation.FormDigestValue;
    $.ajax({
        url: "https://mydomain.sharepoint.com/sites/mysite/mysubsite/_api/web/lists/GetByTitle('MyListName')/fields",
        type: "POST",
        data: { '__metadata': { 'type': 'SP.FieldChoice' }, 'FieldTypeKind': 6, 'Title': 'NewChoiceField', 'Choices': { '__metadata': { 'type': 'Collection(Edm.String)' }, 'results': [ 'Choice 1', 'Choice 2', 'Choice 3' ] }, 'EditFormat': 1 },
        headers: { 
            "X-RequestDigest": $('#__REQUESTDIGEST').val(digest),
            "accept": "application/json;odata=verbose",
            "content-type": "application/json;odata=verbose"
        },
        success: function(){console.log("success");},
        error: function(){console.log("error");}
    });
},
error:function(data){
    console.log("error getting the digest value")
}
});

However, I get '403 Forbidden' as a response.

The Microsoft.SharePoint.SPException thrown is

"The security validation for this page is invalid and might be corrupted. Please use your web browser's Back button to try your operation again."

Any ideas?

P.S. The account has definitely got the required permissions.

Improve this question
2
  • Modify the request digest header as "X-RequestDigest": $('#__REQUESTDIGEST').val and check. If its in the same web, you dont need contextInfo value via AJAX call
    – Gautam Sheth
    Commented Jan 17, 2019 at 16:05
  • @GautamSheth $('#__REQUESTDIGEST').val() is undefined in modern SharePoint pages, hence the first request to get the digest.
    – Gintas K
    Commented Jan 17, 2019 at 16:08

2 Answers 2

Reset to default
5

You can directly use the FormDigestValue in the RequestDigest header in Modern pages.

The __REQUESTDIGEST is a hidden HTML element which is not present in modern pages. So, it had tripped up your code.

Have modify your code as below by adding the payload separately and then stringifying it:

var payload = { '__metadata': { 'type': 'SP.FieldChoice' }, 
              'FieldTypeKind': 6, 'Title': 'NewChoiceField', 'Choices': { '__metadata': { 'type': 'Collection(Edm.String)' }, 'results': [ 'Choice 1', 'Choice 2', 'Choice 3' ] }, 'EditFormat': 1 
            };

$.ajax({
url: "https://mydomain.sharepoint.com/sites/mysite/mysubsite/_api/contextinfo",
method: "POST",
headers: { "Accept": "application/json; odata=verbose" },
success:function(data){

    $.ajax({
        url: "https://mydomain.sharepoint.com/sites/mysite/mysubsite/_api/web/lists/GetByTitle('MyListName')/fields",
        type: "POST",
        data: JSON.stringify(payload),
        headers: { 
            "X-RequestDigest": data.d.GetContextWebInformation.FormDigestValue,
            "accept": "application/json;odata=verbose",
            "content-type": "application/json;odata=verbose"
        },
        success: function(){console.log("success");},
        error: function(){console.log("error");}
    });
},
error:function(data){
    console.log("error getting the digest value")
}
});
Improve this answer
1
  • any luck the above code ? i tried it in my Modern page environment and it works :)
    – Gautam Sheth
    Commented Jan 21, 2019 at 6:43
1

The following code for your reference.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
function addChoiceField(){
    var siteUrl="https://mydomain.sharepoint.com/sites/mysite/mysubsite";
    var listTitle="MyListName";
    $.ajax({
        url: siteUrl+"/_api/contextinfo",
        method: "POST",
        headers: { "Accept": "application/json; odata=verbose" },
        success:function(data){
            var digest = data.d.GetContextWebInformation.FormDigestValue;
            $.ajax({
                url: siteUrl+"/_api/web/lists/GetByTitle('"+listTitle+"')/fields",
                type: "POST",
                data: JSON.stringify({ '__metadata': { 'type': 'SP.FieldChoice' }, 'FieldTypeKind': 6, 'Title': 'NewChoiceField', 'Choices': { '__metadata': { 'type': 'Collection(Edm.String)' }, 'results': [ 'Choice 1', 'Choice 2', 'Choice 3' ] }, 'EditFormat': 1 }),
                headers: { 
                    "X-RequestDigest": digest,
                    "accept": "application/json;odata=verbose",
                    "content-type": "application/json;odata=verbose"
                },
                success: function(){console.log("success");},
                error: function(err){
                    console.log(JSON.stringify(err));
                }
            });
        },
        error:function(data){
            console.log("error getting the digest value")
        }
    });
}
</script>
<input type="button" value="AddField" onclick="addChoiceField()"/>

enter image description here

Improve this answer

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.