Kitsakorn P Kitsakorn P - 23 days ago 6
AngularJS Question

AngularJS Fail to pass new value from textbox for update data in sql

I'm trying to pass my new data to update data in my database but the input still sending the old value from it first query. I mean I already type new information in my textbox but it still send own value. Post data is fine and php part is fine, but I need new value that I have typed to be sent not old value. Please help !

Here are my codes:

<div ng-repeat="x in content | filter:usercontent" >
<input type="text" value="{{x.Username}}"> </br> </br>
<input type="text" value="{{x.Firstname}}"> </br> </br>
<input type="text" value="{{x.Lastname}}"> </br> </br>
<input type="text" value="{{x.Email}}"> </br> </br>
<input type="text" value="{{x.Tel}}"> </br> </br>
<td><button ng-click="edituser(x.Username,x.Firstname,x.Lastname,x.Email,x.Tel)" >Edit</button></td>
<!--<td><button ng-click="deleteData(x.Username)">Del</button></td>-->
</br> </br>
</div>
</div></center>


$scope.edituser = function(Username,Firstname,Lastname,Email,Tel)
{
//console.log($scope.usercontent);
var postdata = {

'Username' : Username,
'Firstname' : Firstname,
'Lastname' : Lastname,
'Email' : Email,
'Tel' : Tel

};
var path = 'http://localhost/edituser.php';
console.log(Username,Firstname,Lastname,Email,Tel);
console.log(getCookie("Username"));
$http.post(path, postdata
).success(function (data, status, headers, config) {

console.log("pass data complete !");

}).error(function (data, status) { // called asynchronously if an error occurs

alert("NO");
});
}

Answer

First thing is that you should define ng-model for all text boxes :

 <div ng-repeat="x in content | filter:usercontent" >
  <input type="text" ng-model="x.Username" value="{{x.Username}}"> </br> </br> 
  <input type="text" ng-model="x.Firstname"  value="{{x.Firstname}}">  </br> </br> 
   <input type="text" ng-model="x.Lastname" value="{{x.Lastname}}"> </br> </br> 
  <input type="text" ng-model="x.Email" value="{{x.Email}}">  </br> </br> 
   <input type="text" ng-model="x.Tel" value="{{x.Tel}}"> </br> </br> 
  <td><button ng-click="edituser(x)" >Edit</button></td>
  <!--<td><button ng-click="deleteData(x.Username)">Del</button></td>-->
  </br> </br> 
</div>
</div></center>

In your controller :

 $scope.edituser = function(x)
    {
     // variable x will contain all value of that textboxes which will be updated if user has changed it from textboxes