LoginSignup
3
4

More than 5 years have passed since last update.

ui.bootstrapのTypeaheadでselect後のコールバック

Last updated at Posted at 2015-03-12

ui.boostrap には typeahead があるので、オートコンプリート機能(文字を入力すると候補をプルダウンで表示してくれるアレ)が実現出来ます。

■ドキュメント
http://angular-ui.github.io/bootstrap/#/getting_started#typeahead

ハマりポイント

ちょっとハマったのが、プルダウンから候補を選択後に何か処理をさせたい場合。
ng-changeではなく、typeahead-on-select を使うのが良いようです。

サンプル

hoge.html
<input type="text" autocomplete="off"
       ng-model="selectedUser"
       typeahead="user as user.Name for user in searchUser($viewValue)"
       typeahead-loading="loadingLocations"
       typeahead-on-select="addUser($item)">

test.coffee
$scope.addUser = (hoge) ->
  alert hoge.Name
  # do something...
3
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
4