Hi,
I am using AngularJS for displaying and Adding list Items, so there are 2 controllers one for adding and one for displaying list items
i want refresh the controller after adding new list items, below is the JS code
var spApp = angular
.module("spApp", [])
.controller("viewItemsController", function ($scope, $http) {
var url = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('Contacts')/items?$select=Title,FirstName,ID";
$http(
{
method: "GET",
url: url,
headers: { "accept": "application/json;odata=verbose" }
}
).then(function (data, status, headers, config) {
$scope.contacts = data.data.d.results;
}).catch(function (data, status, headers, config) {
});
})
.controller("addItemsController", function ($scope, $http) {
var url = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('Contacts')/items";
var vm = $scope;
vm.addContact = function () {
return $http({
headers: { "Accept": "application/json; odata=verbose","Content-Type": "application/json; odata=verbose","X-RequestDigest": jQuery("#__REQUESTDIGEST").val() },
method: "POST",
url: url,
data: {
__metadata: {
"type": "SP.Data.ContactsListItem"
},
'Title': vm.lastName,
'FirstName': vm.firstName
}
})
.then(saveContact)
.catch(function (message) {
console.log("addContact() error: " + message);
});
function saveContact(data, status, headers, config) {
alert("Item Added Successfully");
return data.data.d;
}
}
})below is the html code which i am using in content editor webpart
<h3>View Contacts</h3><hr /><div ng-app="spApp"><div ng-controller="viewItemsController"><div ng-repeat="contact in contacts">
{{contact.ID}}: {{contact.Title}}, {{contact.FirstName}}</br></div></div><hr /><h3>Add Contacts</h3><div ng-controller="addItemsController"><div class="Table"><div class="Row"><div class="Cell">
First Name :</div><div class="Cell"><input type="text" id="firstName" ng-model="firstName"/></div></div><div class="Row"><div class="Cell">
Last Name :</div><div class="Cell"><input type="text" id="lastName" ng-model="lastName"/></div></div><div class="Row"><div class="Cell"></div><div class="Cell"><input type="button" id="btnAddContact" value="Add Contact" ng-click="addContact()"/></div></div></div></div><hr />sal