CODEWITHSUNDEEP
javascriptangularjs
qichunren
qichunren

Reputation: 4475

Hidden input field in Angularjs not update

I use angularjs v1.0.7. I have a hidden form field, which it's value is related with other input value. In http://jsfiddle.net/4ANaK/ example, hidden filed not update as I type in text input filed filed. 

<div ng-controller="MyCtrl">
    <form ng-submit="action()">
      name:<input ng-model="name" type="text"  value="you name">
      <input ng-model="nice_name" type="hidden" value="Mr {{name}}" >
      <input type="submit">
    </form>
</div>

var app=angular.module('myApp', []);

function MyCtrl($scope) {
    $scope.name = "David";

    $scope.action = function(){
        alert($scope.nice_name);                
    }
}

How to fixed the problem?

Upvotes: 2

Views: 1406

Answers (1)

Jesus is Lord
Jesus is Lord

Reputation: 15409

Attempt 1

Adding this to your controller solves your fiddle. Does it solve your real problem, too?

$scope.$watch('name', function (value) {
    $scope.nice_name = 'Mr ' + value;
});

http://jsfiddle.net/4kySW/

Attempt 2

Alright so what about this? This is done purely in the view.

http://jsfiddle.net/4kySW/1/

<input ... ng-change="nice_name = 'Mr ' + name" ng-init="nice_name = 'Mr ' + name">

Edit

Looks like the ng-init wasn't necessary.

Upvotes: 1

Related Questions