Prevent disabled/readonly rating from getting focus

pull/5/head
cagataycivici 2018-12-24 23:37:35 +03:00
parent ece2604344
commit 42c3b9d0a5
1 changed files with 5 additions and 2 deletions

View File

@ -1,7 +1,7 @@
<template> <template>
<div :class="containerClass"> <div :class="containerClass">
<span class="p-rating-icon p-rating-cancel pi pi-ban" tabindex="0" v-if="cancel" @click="onCancelClick"></span> <span class="p-rating-icon p-rating-cancel pi pi-ban" :tabindex="focusIndex" v-if="cancel" @click="onCancelClick"></span>
<span :key="i" v-for="i in stars" @click="onStarClick($event,i)" tabindex="0" @keydown.enter.prevent="onStarClick($event,i)" <span :key="i" v-for="i in stars" @click="onStarClick($event,i)" :tabindex="focusIndex" @keydown.enter.prevent="onStarClick($event,i)"
:class="['p-rating-icon', {'pi pi-star-o': (i > value), 'pi pi-star': (i <= value)}]"></span> :class="['p-rating-icon', {'pi pi-star-o': (i > value), 'pi pi-star': (i <= value)}]"></span>
</div> </div>
</template> </template>
@ -45,6 +45,9 @@ export default {
'p-disabled': this.disabled 'p-disabled': this.disabled
} }
]; ];
},
focusIndex() {
return (this.disabled || this.readonly) ? null : '0';
} }
} }
} }