简体   繁体   中英

AngularJs Bootstrap typeahead detect event fired on enter key

I have an angular bootstrap typeahead and the code is as given below.

Html :

<div class="col-sm-12 dlg-zero-margin-padding hide-last-result" align="left">
    <input type="text" id="myInput" 
        ng-model="selected" 
        ng-keyup="myKeyUp(event,this.value)"
        typeahead="item for item in filterInput($viewValue)"
        typeahead-on-select='onSelect($item)'>                       
</div>

My controller

$scope.myKeyUp(event, value) {
    debugger;
}
$scope.onSelect(event, value) {
    debugger;
}

When mouse focus is on any of the typeahead options, my onSelect function is invoked regardless of mouse click or enter key press. IE it is called whenever a selection is made. But I want to differentiate between a mouse click and enter key selection as I want to add some different flow in each case.

How can I invoke 2 separate functions on enter key press and on mouse click. Or can I detect enter key press or a mouse click in my onSelect function?

Please note : On keyup event(ie myKeyUp()) does not fire when I press "enter". Only onSelect function gets invoked.

inside your function you can identify if enter key is pressed and handle both case

$scope.onSelect(event, value) {
if(event.which ===13){
//enter is pressed
}else{
debugger;
}
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM