AngularJS + UI Bootstrap Typeahead: preload value from object into input field
11,625
You can use the product object
as ng-model
. And then you can simply get the id
use form.product.id
.
<div ng-controller="MyTabCtrl"> <pre>Model: {{form.product.id | json}}</pre>
<p>The goal is to show "Horay!" while the model is set to 1.</p>
<input type="text" autocomplete="off" ng-model="form.product" typeahead="option as option.name for option in p.options | filter:$viewValue" />
<p>Try to write "Audi".</p>
</div>
Related videos on Youtube
Author by
honzzz
Updated on June 04, 2022Comments
-
honzzz almost 2 years
I am trying to use AngularJS + UI Bootstrap Typeahead to fill in input field with name attribute of an object while I need to use id attribute of this object when the form is sent.
The problem is that when I try to preload the input with some previously saved value - the value of id attribute is displayed inside the input instead of the value of name attribute.
<input type="text" ng-model="form.product_id" typeahead="option.id as option.name for option in p.options | filter:$viewValue" />
How do I preload the value of name attribute and still keep the desired functionality?
-
Hieu Nguyen almost 11 yearsSame fiddle but working: jsfiddle.net/hieuh25/CXnKD
-