I can't apply the modification of my data selected from a table row

See more:

AngularJs

ASP.NET5

Hi,
I have problem in my code when I try to modify a row from a table, I work with AngularJS as client and ASP.Net as the rest API, this is my HTML code :

<table ng-controller="etudmodifCtrl">
<thead>
</thead>
 <tbody >
 <tr ng-repeat="store in currentPageStores>
       <td align="center">{{store.LastName}}</td>
       <td align="center">{{store.FirstName}}</td>
       <td align="center">{{store.Email}}</td> 
	   <td align="center" >{{store.Id}}</td>
       <td align="center" ng-controller="etuddeleteCtrl">
          <div id="myModal" class="modal fade" role="dialog" >
            <div class="modal-dialog">
              <div class="modal-content">
                <div class="modal-header">....</div>
                <div class="modal-body">
                       <div class="form-group">
                         <label>LastName</label>
                            <div class="col-sm-10">
                 <input type="text" class="form-control"  ng-model="nomet">
                            </div>
                        </div>
                        <div class="form-group">
                         <label>FirstName</label>
                            <div class="col-sm-10">
               <input type="text" class="form-control"  ng-model="prenomet">
                            </div>
                        </div>
                        <div class="form-group">
                         <label>Email</label>
                            <div class="col-sm-10">
             <input type="text" class="form-control"  ng-model="email">
                            </div>
                        </div>
                </div>
				//click on this button will apply the modification
                <div class="modal-footer">
                   <button id="button" data-dismiss="modal">OK</button>
                </div>
            </div>  
        </div>
     //this button opens the modal in which I will modify the data
         <button ng-click="open(store.Id)" data-target="#myModal">Modify</button>
        </td>
    </tr></tbody></table> 

and this is the controller:

.controller("etudmodifCtrl", ["$scope", "$http", "logger","$route", function ($scope, $http, logger,$route) {


                          $scope.errors = [];
                          $scope.msgs = [];

                           $scope.open = function (Id) {

                               console.log("ID open---");
                               console.log(Id);
                          $http({method: 'GET', url: 'http://localhost:50001/api/Students/'+Id})

                                  .success(function (data) {
                                     $scope.errors.splice(0, $scope.errors.length); // remove all error messages
                                     $scope.msgs.splice(0, $scope.msgs.length);
                                     $scope.prenomet=data.FirstName;
                                     $scope.nomet=data.LastName;
                                     $scope.email=data.Email;
                                      console.log("success display");

                         document.getElementById('button').onclick = function() {
                           console.log("ID après modifetud---");
                           console.log(Id);
                           $http({method: 'PUT',
                                url:'http://localhost:50001/api/Students/modifier/'+Id,
                                headers: {'Content-Type': 'application/json'},
                                data:'{"FirstName":"'+$scope.prenomet+'","LastName":"'+$scope.nomet+'","Email":"'+$scope.email+'"}'
                            }

                                   )

                                  .success(function () {
                                      console.log("-----success-----"+Id);
                                      console.log($scope.prenomet+" "+$scope.nomet+" "+$scope.email);
                                      logger.logSuccess("etudiant a été modifié avec succès");

                                  }).error(function () {

                              logger.logError("echec de modification de l'étudiant");
                              console.log("data error ...");
                          });
                                 }

                                  }).error(function (data, status, headers, config) {
                              console.log("data error ...");
                          });

                           }}])

Per example If I select the row of table with Id=6 I get correctly the data in the input forms,but when I try to modify the input data then clic on the "OK" button I get always the old data not the modifed one

with
Id=6,and $scope.prenomet=Student6,$scope.nomet=6,$scope.email=student6@yahoo.com(without modifcation),if I modify this data to scope.prenomet=Student66,$scope.nomet=66,$scope.email=student66@yahoo.com
I get this on console:

ID open---
6
success display
ID après modifetud---
6
-----success-----6
Student6 6 student6@yahoo.com
success

have you any idea please about the problem,thanks a lot for help