How to pass json object to webapi method using AngularJs [Resolved]

Posted by Syedshakeer under AngularJS on 10/6/2016 | Points: 10 | Views : 311 | Status : [Member] | Replies : 2
Hi,

I have below json data
 var album = {
AlbumName: "PowerAge",
Entered: "1/1/1977"
}


How to pass above data to webAPI Url and retrieve the data in webAPI method?

Syed Shakeer Hussain


Responses

Posted by: Rajnilari2015 on: 10/7/2016 [Member] [Microsoft_MVP] [MVP] Platinum | Points: 50

Up
0
Down

Resolved
@Syedshakeer Sir, use $http.post method.

e.g.

index.html
-------------

<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js@1.4.0-beta.6" data-semver="1.4.0-beta.6" src="https://code.angularjs.org/1.4.0-beta.6/angular.js">
</script>
<script>
var app = angular.module("testApp", []);
app.controller("testCtrl", function ($scope, $http) {

$scope.sendJSonData = function () {

var album = {
AlbumName: "PowerAge",
Entered: "1/1/1977"
};

$http.post('http://localhost:22900/Album/AlbumRecords', album)
.success(function (data, status, headers, config) {
$scope.serverResponse = data;
})
.error(function (data, status, header, config) {
alert(status);
});
};

});
</script>

</head>

<body ng-app="testApp">
<div ng-controller="testCtrl">
<button ng-click="sendJSonData()">Submit</button>
<p>{{ serverResponse }}</p>
</div>
</body>
</html>


WebAPI
-------------

using System;
using System.Collections.Generic;
using System.Web.Http;
using WebApplication1.Models;

namespace WebApplication1.Controllers
{
[RoutePrefix("Album")]
public class AlbumController : ApiController
{
[Route("AlbumRecords")]
[HttpPost]
public string PostAlbumRecords([FromBody]Album album)
{
var record = album;
return "server response" + " AlbumName : " + record.AlbumName + " Entered: " + record.Entered;
}
}

public class Album
{
public string AlbumName { get; set; }
public DateTime Entered { get; set; }
}
}


Hope that helps.

Read more at: http://techfunda.com/howto/565/http-post-server-request


--
Thanks & Regards,
RNA Team

Syedshakeer, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Syedshakeer on: 10/7/2016 [Member] Starter | Points: 25

Up
0
Down
Hi Rajni,

Album Properties contains null values?

public string PostAlbumRecords([FromBody]Album album)

{
var record = album;
return "server response" + " AlbumName : " + record.AlbumName + " Entered: " + record.Entered;
}


Syed Shakeer Hussain

Syedshakeer, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response