How to pass class object in angularjs function

Question

I have a class

public class Customer
{
    private int _Id;
    public int Id
    {
        get { return _Id; }
        set { _Id = value; }
    }
    private String _Name;
    public String Name
    {   
        get { return _Name; }
        set { _Name = value; }
    }
    private String _Address;
    public String Address
    {
        get { return _Address; }
        set { _Address = value; }
    }      
}

I need to save data using this class. I need to know how to call this class in data function

  $scope.Save = function () {
            var httpreq = {
                method: 'POST',
                url: 'ajs.aspx/Save',
                headers: {
                    'Content-Type': 'application/json; charset=utf-8',
                    'dataType': 'json'
                },
                data: { //** Here How to call assign object value for my customer class **//  }
            }
            $http(httpreq).success(function (response) {
               alert("Saved successfully.");
            })
        };

How to create class object and assign value for my customer class in this data section.

In my web method

[System.Web.Services.WebMethod()]
    public static void Save(Customer objcsr)
    {
        using (SqlConnection con = new SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings["DBConnection"].ConnectionString))
        {
            using (SqlCommand cmd = new SqlCommand())
            {
                cmd.Connection = con;
                cmd.CommandText = "insert into customer (Name, Address) values (@Name, @Address);";
                cmd.Parameters.AddWithValue("@Name", objcsr.Name);
                cmd.Parameters.AddWithValue("@Address", objcsr.Address);
                con.Open();
                cmd.ExecuteNonQuery();
                con.Close();
            }
        }
    }

Possible duplicate of [POSTing from Angular to .net WebAPI](http://stackoverflow.com/questions/16621706/posting-from-angular-to-net-webapi) — Ramesh Rajendran, Nov 22 '16 at 05:27

score 0 · Answer 1 · answered Nov 22 '16 at 05:15

You need pass the json format data with the class properties, Try this below code

Var objcsr={Id:"1",Name:"Donald Trump",Address:"Alien Planet"}

$scope.Save = function () {
            var httpreq = {
                method: 'POST',
                url: 'ajs.aspx/Save',
                headers: {
                    'Content-Type': 'application/json; charset=utf-8',
                    'dataType': 'json'
                },
                data: objcsr
            }
            $http(httpreq).success(function (response) {
               alert("Saved successfully.");
            })
        };

score 0 · Answer 2 · answered Nov 22 '16 at 05:19

When you are sending data from client to server, according to the best practices, the data should be sent either in the form of XML or JSON.

Hence, the JSON of your class object could be something like

var obj = {
   "id" : "YOUR ID",
   "name" : "YOUR NAME",
   "address" : "YOUR ADDRESS"
}

Moreover, according to the best practices, the http requests should be made using a factory or service.

So your factory should be something like

angular.module("YOUR_MODULE").factory('YOUR_SERVICE',function($http,$q){

    var obj = {};
    obj.saveObject = function(data){
       var defer = $q.defer();
       $http.post("YOUR URL",data).then(function(response){
        defer.resolve(response);
       },function(error){
        defer.reject(error);
      });
       return defer.promise;

    }
   return obj;
});

And thus you can make a controller call as

$scope.Save = function (data) {
     YOUR_SERVICE.saveObject(data);
}

and that can be called like

var obj = {
       "id" : "YOUR ID",
       "name" : "YOUR NAME",
       "address" : "YOUR ADDRESS"
    }
    $scope.Save(obj);

Aravind · Answer 3 · 2016-11-22T05:30:36.953

If your getting it from form elements then you should be using it like

$scope.Save = function () {
            var customerObject={
                                "Id": $scope.customerId,
                                "Name": $scope.customerName,
                                "Address":$scope.customerAddress  
                              };                                  
            var httpreq = {
                method: 'POST',
                url: 'ajs.aspx/Save',
                headers: {
                    'Content-Type': 'application/json; charset=utf-8',
                },
                data: { customerObject }
            }
            $http(httpreq).success(function (response) {
               alert("Saved successfully.");
            })
        };

Also Note that, the objectName and their respective properties that your are passing should match with that of the objectName in webmethod. For example

Your properties are your corresponding json object must have the same properties

Id: $scope.Id

Name: $scope.Name

Address: $scope.Address

How to pass class object in angularjs function

3 Answers3