Fixed #114 - Calendar icon button submitting my form

pull/132/head
cagataycivici 2019-12-20 17:32:34 +03:00
parent 11dfdb18ca
commit 69c6950330
1 changed files with 11 additions and 11 deletions

View File

@ -1,17 +1,17 @@
<template> <template>
<span :class="containerClass"> <span :class="containerClass">
<CalendarInputText ref="input" v-if="!inline" type="text" v-bind="$attrs" v-on="listeners" v-model="inputFieldValue" :readonly="!manualInput" /> <CalendarInputText ref="input" v-if="!inline" type="text" v-bind="$attrs" v-on="listeners" v-model="inputFieldValue" :readonly="!manualInput" />
<CalendarButton v-if="showIcon" :icon="icon" tabindex="-1" class="p-datepicker-trigger p-calendar-button" :disabled="$attrs.disabled" @click="onButtonClick" /> <CalendarButton v-if="showIcon" :icon="icon" tabindex="-1" class="p-datepicker-trigger p-calendar-button" :disabled="$attrs.disabled" @click="onButtonClick" type="button" />
<transition name="p-input-overlay" @enter="onOverlayEnter" @after-enter="onOverlayEnterComplete" @leave="onOverlayLeave"> <transition name="p-input-overlay" @enter="onOverlayEnter" @after-enter="onOverlayEnterComplete" @leave="onOverlayLeave">
<div ref="overlay" :class="panelStyleClass" v-if="inline ? true : overlayVisible"> <div ref="overlay" :class="panelStyleClass" v-if="inline ? true : overlayVisible">
<template v-if="!timeOnly"> <template v-if="!timeOnly">
<div class="p-datepicker-group" v-for="(month,i) of months" :key="month.month + month.year"> <div class="p-datepicker-group" v-for="(month,i) of months" :key="month.month + month.year">
<div class="p-datepicker-header"> <div class="p-datepicker-header">
<slot name="header"></slot> <slot name="header"></slot>
<button class="p-datepicker-prev p-link" v-if="i === 0" @click="navBackward($event)"> <button class="p-datepicker-prev p-link" v-if="i === 0" @click="navBackward($event)" type="button">
<span class="p-datepicker-prev-icon pi pi-chevron-left"></span> <span class="p-datepicker-prev-icon pi pi-chevron-left"></span>
</button> </button>
<button class="p-datepicker-next p-link" v-if="numberOfMonths === 1 ? true : (i === numberOfMonths - 1)" @click="navForward($event)"> <button class="p-datepicker-next p-link" v-if="numberOfMonths === 1 ? true : (i === numberOfMonths - 1)" @click="navForward($event)" type="button">
<span class="p-datepicker-next-icon pi pi-chevron-right"></span> <span class="p-datepicker-next-icon pi pi-chevron-right"></span>
</button> </button>
<div class="p-datepicker-title"> <div class="p-datepicker-title">
@ -63,12 +63,12 @@
<div class="p-timepicker" v-if="showTime||timeOnly"> <div class="p-timepicker" v-if="showTime||timeOnly">
<div class="p-hour-picker"> <div class="p-hour-picker">
<button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 0, 1)" @mouseup="onTimePickerElementMouseUp($event)" <button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 0, 1)" @mouseup="onTimePickerElementMouseUp($event)"
@mouseleave="onTimePickerElementMouseLeave()"> @mouseleave="onTimePickerElementMouseLeave()" type="button">
<span class="pi pi-chevron-up"></span> <span class="pi pi-chevron-up"></span>
</button> </button>
<span :style="{'display': currentHour < 10 ? 'inline': 'none'}">0</span><span>{{currentHour}}</span> <span :style="{'display': currentHour < 10 ? 'inline': 'none'}">0</span><span>{{currentHour}}</span>
<button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 0, -1)" @mouseup="onTimePickerElementMouseUp($event)" <button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 0, -1)" @mouseup="onTimePickerElementMouseUp($event)"
@mouseleave="onTimePickerElementMouseLeave()"> @mouseleave="onTimePickerElementMouseLeave()" type="button">
<span class="pi pi-chevron-down"></span> <span class="pi pi-chevron-down"></span>
</button> </button>
</div> </div>
@ -83,12 +83,12 @@
</div> </div>
<div class="p-minute-picker"> <div class="p-minute-picker">
<button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 1, 1)" @mouseup="onTimePickerElementMouseUp($event)" <button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 1, 1)" @mouseup="onTimePickerElementMouseUp($event)"
@mouseleave="onTimePickerElementMouseLeave()"> @mouseleave="onTimePickerElementMouseLeave()" type="button">
<span class="pi pi-chevron-up"></span> <span class="pi pi-chevron-up"></span>
</button> </button>
<span :style="{'display': currentMinute < 10 ? 'inline': 'none'}">0</span><span>{{currentMinute}}</span> <span :style="{'display': currentMinute < 10 ? 'inline': 'none'}">0</span><span>{{currentMinute}}</span>
<button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 1, -1)" @mouseup="onTimePickerElementMouseUp($event)" <button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 1, -1)" @mouseup="onTimePickerElementMouseUp($event)"
@mouseleave="onTimePickerElementMouseLeave()"> @mouseleave="onTimePickerElementMouseLeave()" type="button">
<span class="pi pi-chevron-down"></span> <span class="pi pi-chevron-down"></span>
</button> </button>
</div> </div>
@ -103,12 +103,12 @@
</div> </div>
<div class="p-second-picker" v-if="showSeconds"> <div class="p-second-picker" v-if="showSeconds">
<button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 2, 1)" @mouseup="onTimePickerElementMouseUp($event)" <button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 2, 1)" @mouseup="onTimePickerElementMouseUp($event)"
@mouseleave="onTimePickerElementMouseLeave()"> @mouseleave="onTimePickerElementMouseLeave()" type="button">
<span class="pi pi-chevron-up"></span> <span class="pi pi-chevron-up"></span>
</button> </button>
<span :style="{'display': currentSecond < 10 ? 'inline': 'none'}">0</span><span>{{currentSecond}}</span> <span :style="{'display': currentSecond < 10 ? 'inline': 'none'}">0</span><span>{{currentSecond}}</span>
<button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 2, -1)" @mouseup="onTimePickerElementMouseUp($event)" <button class="p-link" @mousedown="onTimePickerElementMouseDown($event, 2, -1)" @mouseup="onTimePickerElementMouseUp($event)"
@mouseleave="onTimePickerElementMouseLeave()"> @mouseleave="onTimePickerElementMouseLeave()" type="button">
<span class="pi pi-chevron-down"></span> <span class="pi pi-chevron-down"></span>
</button> </button>
</div> </div>
@ -122,11 +122,11 @@
</span> </span>
</div> </div>
<div class="p-ampm-picker" v-if="hourFormat=='12'"> <div class="p-ampm-picker" v-if="hourFormat=='12'">
<button class="p-link" @click="toggleAMPM($event)"> <button class="p-link" @click="toggleAMPM($event)" type="button">
<span class="pi pi-chevron-up"></span> <span class="pi pi-chevron-up"></span>
</button> </button>
<span>{{pm ? 'PM' : 'AM'}}</span> <span>{{pm ? 'PM' : 'AM'}}</span>
<button class="p-link" @click="toggleAMPM($event)"> <button class="p-link" @click="toggleAMPM($event)" type="button">
<span class="pi pi-chevron-down"></span> <span class="pi pi-chevron-down"></span>
</button> </button>
</div> </div>