Ibrahim Shaikh Ibrahim Shaikh - 2 months ago 6
ASP.NET (C#) Question

fetching data from angularjs asp.net

I am Creating a web app in asp.net with the help of sql server i am using angularjs because i have many data and normal c# is very slow in fetching data as compared to angularjs

I created a webservice which is running absolutely fine

[WebMethod]
[ScriptMethod(UseHttpGet = true)]
public void pageload(string log,string pm)
{
List<object> page = new List<object>();
SqlCommand cmd = new SqlCommand("csuv4",con);
cmd.Connection = con;
cmd.CommandType = CommandType.StoredProcedure;
SqlParameter[] param =
{
new SqlParameter("@logintype",log),
new SqlParameter("@name",pm)
};
con.Open();
cmd.Parameters.AddRange(param);
SqlDataReader dr = cmd.ExecuteReader();
while (dr.Read())
{
page.Add(new
{
Id = dr["id"].ToString(),
Zone = dr["zone"].ToString(),
Location = dr["location"].ToString(),
VenueName = dr["venuename"].ToString(),
Venue = dr["venue"].ToString(),
Date = dr["date"].ToString(),
BrandName = dr["brandname"].ToString(),
StartTime = dr["starttime"].ToString(),
EndTime = dr["endtime"].ToString(),
HRS = dr["hrs"].ToString(),
Program = dr["Program"].ToString()
});
}
con.Close();
var json = js.Serialize(page);
Context.Response.Write("{" + '"' + "page" + '"' + ":" + json + "}");
}


But I am not able to see any data in my table i am really very new in angularjs and i cant find out what i am doing wrong

here is my js file and my aspx> (i am written the code of my js within my aspx page)

<script>
var app = angular.module('myApp', []);
app.controller('csuvload', function ($scope, $http) {

$scope.getsonvindata = function () {
$scope.names = '';
$http.get('/csuv5.asmx/pageload', {
params: {
log: log,
pm: pm
}
})
.then(function (response) {
$scope.sonvinrpm = response.data.page;
console.log(response.data.page);
});
}
});

</script>
<script>
var pm = "<%= Convert.ToString(Session["selectpmname"]) %>";
var log = "<%= Convert.ToString(Session["radio"]) %>";
</script>


this is my js file:

and the following is my aspx table

<div ng-app="myApp" ng-controller="csuvload">
<div class="table-responsive">
<table class="table table-bordered font" style="width: 110%;">
<tr class="bg-primary">
<th>Id</th>
<th>Zone</th>
<th>Location</th>
<th>VenueName</th>
<th>Venue</th>
<th>Date</th>
<th>BrandName</th>
<th>StartTime</th>
<th>EndTime</th>
<th>HRS</th>
<th>Program</th>
<th>Assign_Trainer</th>
</tr>
<tr ng-repeat="x in sonvinrpm" ng-model="sonvinrpm">
<td>{{x.id}}</td>
<td>{{x.Zone}}</td>
<td>{{x.Location}}</td>
<td>{{x.Venuename}}</td>
<td>{{x.Venue}}</td>
<td>{{x.Date}}</td>
<td>{{x.BrandName}}</td>
<td>{{x.StartTime}}</td>
<td>{{x.EndTime}}</td>
<td>{{x.HRS}}</td>
<td>{{x.Program}}</td>
<td>
<button type="button" ng-click="DetailsFunction(x)" class="btn btn-sm btn-primary active" data-toggle="modal" data-target="#Detailsmodel"><i class="glyphicon glyphicon-pencil"></i></button>
<button type="button" ng-click="getassigntrainerdata(x)" class="btn btn-sm btn-danger active" data-toggle="modal" data-target="#assigntrainermodel"><i class="glyphicon glyphicon-remove-sign"></i></button>
</td>
</tr>
</table>
</div>
</div>


I want to show this data on page load

Answer

as you written

I want to show this data on page load

Replace Your JS File With this

<script>
    var app = angular.module('myApp', []);
    app.controller('csuvload', function ($scope, $http) {
            $scope.names = '';
            $http.get('/csuv5.asmx/pageload', {
                params: {
                    log: log,
                    pm: pm
                }
            })
            .then(function (response) {
                $scope.sonvinrpm = response.data.page;
                console.log(response.data.page);
            });
    });

</script>

i just remove $scope.getsonvindata = function () { this from your js file

happy coding