0

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>

    <script>

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

    {

    $scope.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('Questions')/items",
    data:{
    'Title' : $scope.Title,
    'Description':$scope.Description,
    'Tag':$scope.Tag

    }


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

    </script>

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

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

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

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

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

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

1 Answer 1

2

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
                }


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

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

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.