juanj10 juanj10 - 1 year ago 124
AngularJS Question

Update value of an input text when an option is selected with angularjs

I have my controller in angularjs with a array

app.controller('player', function($scope) {
$scope.players = [

In my HTML I have HTML with a
and a

<html ng-app="pdl">
<body ng-controller="player">
<input type="text" id="name" value=""/>
<select name="id">
<option ng-repeat="player in players" value="{{player.id}}">{{player.id}}</option>

I want to update the input with a 'name' when I choose an option from the dropdown

Answer Source

Bind both select and input to the same ngModel:

angular.module('pdl', []).controller('player', function($scope) {
  $scope.players = [{
    "id": 3,
    "name": "Nadal",
  }, {
    "id": 4,
    "name": "Federer"
<script src="https://code.angularjs.org/1.5.5/angular.min.js"></script>

<div ng-app="pdl" ng-controller="player">
  <input type="text" ng-model="player.name" />
  <select ng-model="player" ng-options="player as player.name for player in players">

And use ngOptions for selectbox.

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