CODEWITHSUNDEEP
javascripthtmlangularjs
BharathRao
BharathRao

Reputation: 2046

Unable to get the hidden field Value via ng-model

I'm new to Angular js and I'm Struggling to access the hidden field value via ng-model.Basically I'm using the Modal for editing.Here is my code for controller:

$scope.update = function(){
            $http({
                method:'POST',
                url:'http://localhost:8000/api/v1/edit',
                data: {id: $scope.editId , name: $scope.edit_name, email: $scope.edit_email, password: $scope.edit_password}
            }).then(function(response){
                $scope.updated_form_data_list = response.data;
            });
        };
    });

I'm trying to set the Id for each record via javascript:

<tbody ng-repeat="form_data in form_data_list"> //Displaying records from DB inside the Table
               <tr>
               <td>@{{ form_data.name }}</td>
               <td>@{{ form_data.email }}</td>
               <td>@{{ form_data.password }}</td>   
               <td><Button type="button" onclick="setEditId(this.id)" data-toggle="modal" data-target="#modal_content" id="@{{form_data.id}}" ><span class="glyphicon glyphicon-pencil"></span></Button></td>   
               </tr>   
    </tbody>

And I have set the value for hidden via javascript,Here it goes:

<script type="text/javascript"> //setting the value of hidden field with id
    function setEditId(id){
        document.getElementById('editId').value=id;
    }
</script>

I have ng-model as editId in the below code:

<div class="modal fade" id="modal_content" role="dialog">
   ...
  <input type="hidden" name="id" id="editId" ng-model="editId">
   ...
<button ng-click="update()">Submit</button>

When I click the Submit button I'm able to post other values except the id. Suggest me any Solution for this. Thanking You in Advance!

Upvotes: 2

Views: 348

Answers (2)

Keerthivasan
Keerthivasan

Reputation: 1661

simple trick...Instead of calling javascript for setting the Id, set that via a controller using ng-click.

$scope.storeId=function(id){
                $scope.id=id;
}

And Called it via

<Button type="button" ng-click="storeId(form_data.id)" data-toggle="modal" data-target="#modal_content">
<span class="glyphicon glyphicon-pencil">

Upvotes: 2

NTP
NTP

Reputation: 4448

since you are using js to set value of editID ng-model is not updated use 

$scope.editId = id;

to change value of your input

Upvotes: 1

Related Questions