how to reload ng-repeat when i clicked button asp.

Question

How would you pass data code to angularjs variable. its working fine when the page loads. But when I click the button, for filter data. The server side does not load data.

$scope.studentinformation = <%= studentattendancejson %>

c# code:

 public static string studentattendancejson = string.Empty;

       protected void Page_Load(object sender, EventArgs e)
       {
        if (!IsPostBack)
        {
            string Query = "SELECT  ts.Idx, ts.student_name,ts.father_name,t.attendancedate,t2.class_name,tat.attendanceType FROM tblstudentattendence t " +
        "INNER JOIN  tblStudent  ts ON ts.student_id = t.student_id INNER JOIN tblclassinfo t2 ON t.class_id = t2.idx " +
        "INNER JOIN tblAttendanceType tat ON t.attendancetype_Id = tat.Idx";
            var getstudentattendance = DbAccess.GetResult(Query);
            studentattendancejson = JsonConvert.SerializeObject(getstudentattendance, Formatting.Indented);           
        }

    }
protected void btnSearch_Click1(object sender, EventArgs e)
        {
string Query = "Select * from tblstudent WHERE student_name = 'Adeel'";
 var getstudentattendance = DbAccess.GetResult(Query);

      studentattendancejson = JsonConvert.SerializeObject(getstudentattendance, Formatting.Indented);
}

HTML\JavaScript\AngularJS code:

//Angularjs variable

<script type="text/javascript">
            var app = angular.module('myApp', []);
            app.controller('myCtrl', ['$scope', '$filter', function ($scope, $filter) {
                $scope.currentPage = 0;
                $scope.pageSize = 100;
                $scope.data = [];
                $scope.q = '';

                $scope.studentinformation = <%= studentattendancejson %>
                $scope.getData = function () {


                    return $filter('filter')($scope.studentinformation, $scope.q)

                }
                $scope.numberOfPages = function () {
                    return Math.ceil($scope.getData().length / $scope.pageSize);
                }


            }]);

            app.filter('startFrom', function () {
                return function (input, start) {
                    start = +start; //parse to int
                    return input.slice(start);
                }
            });

        </script>

 <tr ng-repeat="info in studentinformation| filter:q | startFrom:currentPage*pageSize | limitTo:pageSize">
                                                    <td>{{info.student_name}}</td>
                                                    <td>{{info.father_name}}</td>
                                                    <td>{{info.class_name}}</td>
                                                    <td>{{info.attendancedate | date:'dd-MM-yyyy'}}</td>
                                                    <td ng-if="info.attendanceType == 'Present'"> <button type="button" class="btn btn-success btn-circle"><i class="fa fa-check"></i></td>
                                                     <td ng-if="info.attendanceType == 'Absent'"> <button type="button" class="btn btn-danger btn-circle"><i class="fa fa-times"></i></td>
                                                     <td ng-if="info.attendanceType == 'Leave'"> <button type="button" class="btn btn-warning btn-circle"><i class="fa fa-list"></i></td>


                                                </tr>

                                          &nbsp;<asp:Button ID="btnSearch" runat="server" class="btn btn-primary" OnClick="btnSearch_Click1" Text="Search Student" Width="170px" />
                                          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                          <asp:Button ID="btnClearTxt" runat="server" class="btn btn-primary" Text=" Clear Text" Width="170px" />


                           </div>

Page load working fine

button clicked result

Answer 1

Finally I Solve my Problem :)

 $scope.myData.doClick = function () {

                        $http.post('abc.aspx/GetEmployees', { response: {} })
                         .then(function successCallback(response) {
                             $scope.studentinformation = {};

                             $scope.studentattendance = JSON.parse(response.data.d);

                         })
                          .error(function (response, status, headers, config) {
                              $scope.status = status;
                          });

                    }

//HTML

 <div ng-click="myData.doClick()">Click here</div>

//c#

 [WebMethod]
        public static string GetEmployees()
        {

           string Query "Select * from tblstudent WHERE student_name = 'Adeel'";
            var getstudentattendance = DbAccess.GetResult(Query);
            studentattendancejson = JsonConvert.SerializeObject(getstudentattendance, Formatting.Indented);
            return studentattendancejson;
        }

Ajax call with parameter

  $scope.myData.doClick = function (item,event) {                             
                              var startdate = document.getElementById('txtstart').value;
                              var enddate = document.getElementById('txtend').value;
                              $.ajax({
                                  type: "POST",
                                  url: "studentattendance.aspx/GetEmployees",
                                  data: JSON.stringify({ title: startdate, songname: enddate}),
                                  contentType: "application/json; charset=utf-8",
                                  dataType: "json",
                                  success: function (msg) {
                                      $scope.studentattendance = {};
                                          $scope.studentattendance = JSON.parse(msg.d);
                                          $scope.$apply();

                                  },
                                  error: function (msg) {
                                      alert(msg.d);
                                  }
                              });
                          }

ASP.NET C#//

public static string GetEmployees(string title, string songname)
        {
        }

Answer 2

Page_Load is run as one of the last events in the page life cycle every time the page posts back. So, when you click the button the page posts back and the btnSearch_Click1 event fires and then the Page_load event runs. You need to modify your Page_Load event as follows, so it doesn't overwrite studentattendancejson:

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack) {
        string Query = "SELECT  ts.Idx, ts.student_name,ts.father_name,t.attendancedate,t2.class_name,tat.attendanceType FROM tblstudentattendence t " +
       "INNER JOIN  tblStudent  ts ON ts.student_id = t.student_id INNER JOIN tblclassinfo t2 ON t.class_id = t2.idx " +
       "INNER JOIN tblAttendanceType tat ON t.attendancetype_Id = tat.Idx";
        var getstudentattendance = DbAccess.GetResult(Query);
        studentattendancejson = JsonConvert.SerializeObject(getstudentattendance, Formatting.Indented);
    }
}

Hope this helps. Let me know if you need anything else.