How to get model value from textbox which is binded from dropdown without changing the model value of dropdown

Question

In my project I have a drop down and a text box in a Angular html page. From drop down I select a option , after selecting that option it got binded to textbox. Later I need to change the value of textbox and submit it. I need to latest change value on button click to submit. How to get the latest value on submit?

<select ng-model="val" ng-change="select(val);" ng-options="gro.name for gro in group"></select>

<input type="text" value="{{val.name}}" /> 

Please help.

Answer 1

Use ng-model instead of value

In HTML

<select ng-model="val" ng-change="select(val);" ng-options="gro.name for gro in group"></select>

<input type="text" ng-model="selectedValue" /> 

In controller on change, (i.e ng-change) this will be called and it will update.

function select(val) {
$scope.selectedValue = val;
}

Later if you change in text box, ng-model value (i.e selectedValue) will be binded to the latest value and won't change in dropdown, because dropdown ng-model is different (i.e val).