Interacting With RESTful APIs Using $http in AngularJS
Angular JS call for webmethod in C# AsP.net $http
var app = angular.module('partHeadM', [])
app.controller('partHeadC', function ($scope, $http, $window) {
$scope.searchclick = function (mid) {
$scope.LAanimationshow();
var post = $http({
method: "POST",
url: "PartViewr.aspx/GetPartHeader",
dataType: 'json',
data: JSON.stringify({ 'mid': mid }),
headers: { "Content-Type": "application/json" }
}).then(function (respons, status) {
$scope.LAnimationhide();
console.log(respons.data.d);
var da1 = JSON.parse(respons.data.d);
if (da1.length > 0)
$scope.cmnt = da1[0];
else
{ $scope.cmnt = ''; alert('Material not found.'); }
}, function (respons, status) {
$scope.LAnimationhide();
$window.alert(respons.Message);
});
}
$scope.LAanimationshow = function () {
document.getElementById('loadinganimation').style.display = 'block';
}
$scope.LAnimationhide = function () {
document.getElementById('loadinganimation').style.display = 'none';
}
});
<div
class="col-xs-12 col-sm-9"
ng-app="partHeadM"
ng-controller="partHeadC">
<div
class="row">
<div
class="col-sm-12">
<div
class="section_title"> Viewer</div>
</div>
</div>
<div
class="row"
style="padding-left:
5px; padding-right: 5px;">
<div
class="col-sm-1 form-label">search Mat</div>
<div
class="col-sm-3 form-input"
style="line-height:
14px;">
<asp:TextBox
ID="txtMaterial" runat="server"
CssClass="form-control"
MaxLength="20"
ToolTip="Enter material number"
ng-model="mat1"></asp:TextBox>
</div>
<div
class="col-sm-1 form-button">
<asp:Button
ID="btnSearch" runat="server"
Text="Search" OnClientClick="return
false;" ToolTip="Click
to search" ng-click="searchclick(mat1)"
/>
</div>
</div>
