I am trying to create a list item using angularjs Http service, but am getting an error 403 Forbidden. PFB the code:

    <script src="http://win-pmmmma92p9v:19522/sites/JobSeekers/Resources/angular.js"></script>
    <script src="http://win-pmmmma92p9v:19522/sites/JobSeekers/Resources/jquery-3.2.1.js"></script>


    var myApp=angular.module("myApp",[]).controller("myController",function($scope,$http)


    $scope.addQuestion = function(){

    return $http({
    'Title' : $scope.Title,


    console.log("addQuestion() error:"+message);
    function saveContact(data,status,headers,config)
    alert("Item added successfully");
    return data.data.d;


<div ng-app="myApp">
<div ng-controller="myController">
<input type="text" ng-module="Title" id="title"><br><br>

<textarea ng-module="Description" id="description"></textarea><br><br>

<input type="text" ng-module="Tag" id="tag"><br><br>

<button ng-click="addQuestion()">Post Your Question</button>

I have been trying it for two days, but still dint find any solution, can someone help?

  • could you try referencing the jquery and angularjs file from library instead of cdn links? – SharePointMan Oct 11 '17 at 6:20
  • are you able to add list items manually ? 403 means that you dont have permission to add list items. – Gautam Sheth Oct 11 '17 at 7:26
  • I have referenced files from my library itself @SharePointGoa – Dheeraj Oct 11 '17 at 16:20
  • Yes I am able to add list items manually @Gautham Sheth – Dheeraj Oct 11 '17 at 16:20

You have some typing mistake in your code in header section like ..

  1. You have written Colon (:) instead of semicolon (;) in content type section.
  2. There should be double underscore in $("#__REQUESTDIGEST").val() but you have written single underscore.

Plus you have to add __metadata section which is mission in your code.

Refer/Use below function for addQuestion. It will work for you.

 var addQuestion = function() {

        return $http({
                headers: {
                    "Accept": "application/json;odata=verbose",
                    "X-RequestDigest": $("#__REQUESTDIGEST").val(),
                    "content-type": "application/json;odata=verbose"
                method: "POST",
                url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('Songs')/items",
                data: {
                    __metadata: {
                        "type": "SP.Data.SongsListItem"
                    'Title': $scope.Title,
                    'Description': $scope.Description,
                    'Tag': $scope.Tag

            .catch(function(message) {
                console.log("addQuestion() error:" + message);

        function saveContact(data, status, headers, config) {
            alert("Item added successfully");
            return data.data.d;

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.