Saturday, July 25, 2015

AngularJS $ Ajax calls

In the post AngularJS Ajax using $http we saw that we can perform Ajax calls to the server in AngularJS using $http service, and we saw that $http supports Get, Post, Put and Delete operations. In this post we shall see on how to make a $ Ajax call in AngularJS

The following example shows how to make a $ call to an Asp.Net Web API Controller method.
WebAPI Post Method
    public class PackageController : ApiController
        PkgEntities objDBContext = new PkgEntities();
        public string Post(Package objPackage)
                return "Package " + objPackage.Name + " added Succesfully";
            catch (Exception ex)
                return "Error: " + ex.Message.ToString();
AngularJS call to WebAPI Get method
    this.AddPackage = function (scope) {
        var dataObj = {
            Name: scope.Name,
            Description: scope.Description,
            PackageSQL: scope.PackageSQL,
            Status: scope.Status
        $ + "Package", dataObj)
           .then(function (results) {
               try {
               catch (err) {
           }, function (results) {
               alert("Error: " + + "; "
                                     + results.status);


The $ method creates a JSON object objData calls the server side WebAPI Post() method and passes the object as parameter to the WebAPI method. The WebAPI contoroller method receives the package object from the $ call and inserts a new package to the database context and returns a success/failure message to AngularJS. The AngularJS client method receives the message and displays it to the end user.

Search Flipkart Products:

No comments: