Anton Anton - 2 years ago 94
AngularJS Question

the form doesn't send updated input value

On my page I have bs-table. The data comes from api call. By click on row I send new api call to retrieve row data from db. Then I set scope variable for res data and render it on a page

$('#table').on('', function (e, row, $element) {


var indexId = $table.find($element).data('index');
var rowData = $table.bootstrapTable('getData')[indexId];
$ =;

$http.get(url + $
.then(function (res) {
$scope.rowData =;
$scope.rowKeys = Object.keys($scope.rowData);



<form style="padding: 15px" ng-submit="submitForm()">
<div class="form-group row">
<div ng-repeat="k in rowKeys | filter: '!id'" ng-model="rowValue">
<label for="rowValue" class="col-sm-2">
<!--{{k | hide:'.name'}}:-->
{{k }}:
<div class=" col-sm-2">
<input class="form-control rowValue" id="rowValue" value="{{rowData[k]}}"/>
<button type="submit" class="btn btn-default" ng-if="rowData" >Submit</button>

Then thru ng-submit I want to send back changes which have been made in that form

$scope.submitForm = function() {

$scope.$watch('rowData', function(newValue, oldValue) {
console.log('being watched oldValue:', oldValue, 'newValue:', newValue);
}, true);

method : 'PUT',
url : url + $,
data : $scope.rowData, //form
headers : {'Content-Type': 'application/json'}
.then(function (res) {
return res;

As you can see I've set $watch that to follow for changes in scope variable, but the problem is the console log returns same values for oldValue and newValue. Could anybody explain me where is my mistake? I appreciate any help

Answer Source

You're not binding the values to anything. Instead of using value="{{rowData[k]}}" on your input element, use ng-model: ng-model="rowData[k]".

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download