Fixed enter-tab key for autocomplete item selection
parent
0b1d86247e
commit
38b1f81c1c
|
@ -28,8 +28,8 @@
|
||||||
<li class="p-autocomplete-item-group">
|
<li class="p-autocomplete-item-group">
|
||||||
<slot name="optiongroup" :item="optionGroup" :index="i">{{getOptionGroupLabel(optionGroup)}}</slot>
|
<slot name="optiongroup" :item="optionGroup" :index="i">{{getOptionGroupLabel(optionGroup)}}</slot>
|
||||||
</li>
|
</li>
|
||||||
<li v-for="(item, i) of getOptionGroupChildren(optionGroup)" class="p-autocomplete-item" :key="i" @click="selectItem($event, item)" role="option" v-ripple>
|
<li v-for="(item, j) of getOptionGroupChildren(optionGroup)" class="p-autocomplete-item" :key="j" @click="selectItem($event, item)" role="option" v-ripple :data-group="i" :data-index="j">
|
||||||
<slot name="item" :item="item" :index="i">{{getItemContent(item)}}</slot>
|
<slot name="item" :item="item" :index="j">{{getItemContent(item)}}</slot>
|
||||||
</li>
|
</li>
|
||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
|
@ -110,7 +110,8 @@ export default {
|
||||||
searching: false,
|
searching: false,
|
||||||
focused: false,
|
focused: false,
|
||||||
overlayVisible: false,
|
overlayVisible: false,
|
||||||
inputTextValue: null
|
inputTextValue: null,
|
||||||
|
highlightItem: null
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
@ -385,10 +386,10 @@ export default {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
break;
|
break;
|
||||||
|
|
||||||
//enter,tab
|
//enter
|
||||||
case 13:
|
case 13:
|
||||||
if (highlightItem) {
|
if (highlightItem) {
|
||||||
this.selectItem(event, this.suggestions[DomHandler.index(highlightItem)]);
|
this.selectHighlightItem(event, highlightItem);
|
||||||
this.hideOverlay();
|
this.hideOverlay();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -404,7 +405,7 @@ export default {
|
||||||
//tab
|
//tab
|
||||||
case 9:
|
case 9:
|
||||||
if (highlightItem) {
|
if (highlightItem) {
|
||||||
this.selectItem(event, this.suggestions[DomHandler.index(highlightItem)]);
|
this.selectHighlightItem(event, highlightItem);
|
||||||
}
|
}
|
||||||
|
|
||||||
this.hideOverlay();
|
this.hideOverlay();
|
||||||
|
@ -436,6 +437,15 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
selectHighlightItem(event, item) {
|
||||||
|
if (this.optionGroupLabel) {
|
||||||
|
let optionGroup = this.suggestions[item.dataset.group];
|
||||||
|
this.selectItem(event, this.getOptionGroupChildren(optionGroup)[item.dataset.index]);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.selectItem(event, this.suggestions[DomHandler.indexOfType(item)]);
|
||||||
|
}
|
||||||
|
},
|
||||||
findNextItem(item) {
|
findNextItem(item) {
|
||||||
let nextItem = item.nextElementSibling;
|
let nextItem = item.nextElementSibling;
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue