Fixing paste issue
This commit is contained in:
parent
9b438991b3
commit
fff280ceaf
2 changed files with 71 additions and 88 deletions
|
|
@ -201,27 +201,10 @@ export default {
|
||||||
evt.stopPropagation();
|
evt.stopPropagation();
|
||||||
evt.preventDefault();
|
evt.preventDefault();
|
||||||
|
|
||||||
const input = document.getElementById(evt.srcElement.id);
|
const data = evt.type === 'paste' ? (evt.clipboardData || window.clipboardData) : evt.dataTransfer;
|
||||||
const originalValue = input.value;
|
const value = data.getData('Text')?.trim();
|
||||||
const startPosition = input.selectionStart;
|
|
||||||
const endPosition = input.selectionEnd;
|
|
||||||
const selectionLength = endPosition - startPosition;
|
|
||||||
|
|
||||||
let data = null;
|
this.$emit('update:modelValue', this.modelValue + value);
|
||||||
if (evt.type === 'paste') {
|
|
||||||
data = evt.clipboardData || window.clipboardData;
|
|
||||||
} else {
|
|
||||||
data = evt.dataTransfer;
|
|
||||||
}
|
|
||||||
|
|
||||||
const textValue = data.getData('Text');
|
|
||||||
|
|
||||||
// Insert the pasted/dropped string at the index position
|
|
||||||
const arrOriginalString = originalValue.split('');
|
|
||||||
arrOriginalString.splice(startPosition, selectionLength, textValue);
|
|
||||||
const blendedString = arrOriginalString.join('');
|
|
||||||
|
|
||||||
this.$emit('update:modelValue', blendedString);
|
|
||||||
},
|
},
|
||||||
clickedSearch() {
|
clickedSearch() {
|
||||||
if (this.meta.valid) {
|
if (this.meta.valid) {
|
||||||
|
|
|
||||||
|
|
@ -31,83 +31,83 @@
|
||||||
:includeSearchIcon="true"
|
:includeSearchIcon="true"
|
||||||
:displayQuestionText="false"
|
:displayQuestionText="false"
|
||||||
isRequired
|
isRequired
|
||||||
|
:isDisabled="reloadingProviders"
|
||||||
:validationRules="rules.zipCode"
|
:validationRules="rules.zipCode"
|
||||||
@clickEvent="searchClick" />
|
@clickEvent="searchClick" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Form>
|
</Form>
|
||||||
<div>
|
<googleMap
|
||||||
<googleMap
|
id="map"
|
||||||
id="map"
|
class="mb-4"
|
||||||
class="mb-4"
|
:addresses="providerAddresses"
|
||||||
:addresses="providerAddresses"
|
:zipCode="mapZipCode"></googleMap>
|
||||||
:zipCode="mapZipCode"></googleMap>
|
<Form
|
||||||
<Form
|
id="providerSelectionForm"
|
||||||
id="providerSelectionForm"
|
v-slot="{ meta }"
|
||||||
v-slot="{ meta }"
|
@submit="onSubmit"
|
||||||
@submit="onSubmit"
|
@invalidSubmit="onInvalidSubmit">
|
||||||
@invalidSubmit="onInvalidSubmit">
|
<div class="container-fluid pb-2">
|
||||||
<div class="container-fluid pb-2">
|
<div class="mx-5">
|
||||||
<div class="mx-5">
|
<dropdownQuestion
|
||||||
<dropdownQuestion
|
id="searchRadiusFilter"
|
||||||
id="searchRadiusFilter"
|
v-model="filter"
|
||||||
v-model="filter"
|
:cmsWidgetName="widget.filterByQuestion"
|
||||||
:cmsWidgetName="widget.filterByQuestion"
|
inputId="filterByQuestionField"
|
||||||
inputId="filterByQuestionField"
|
:options="filterOptions"
|
||||||
:options="filterOptions"
|
disableAutoFill
|
||||||
disableAutoFill
|
:isDisabled="reloadingProviders"
|
||||||
:validationRules="rules.filter" />
|
:validationRules="rules.filter" />
|
||||||
<loader
|
<loader
|
||||||
v-if="reloadingProviders"
|
v-if="reloadingProviders"
|
||||||
id="providersLoader"
|
id="providersLoader"
|
||||||
loaderPosition="center"
|
loaderPosition="center"
|
||||||
loaderColor="blue"
|
loaderColor="blue"
|
||||||
:width="2"
|
:width="2"
|
||||||
:height="2"
|
:height="2"
|
||||||
class="my-4" />
|
class="my-4" />
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div class="my-4">
|
<div class="my-4">
|
||||||
<buttonQuestion
|
<buttonQuestion
|
||||||
id="selectProviderQuestion"
|
id="selectProviderQuestion"
|
||||||
v-model="selectedProviderNumber"
|
v-model="selectedProviderNumber"
|
||||||
buttonTypeString="shopListButton"
|
buttonTypeString="shopListButton"
|
||||||
:buttonTypeObject="shopListButton"
|
:buttonTypeObject="shopListButton"
|
||||||
class="radioQuestion"
|
class="radioQuestion"
|
||||||
:answers="providerButtonData"
|
:answers="providerButtonData"
|
||||||
groupName="chooseShop"
|
groupName="chooseShop"
|
||||||
textPosition="text-start"
|
textPosition="text-start"
|
||||||
isRequired
|
isRequired
|
||||||
:validationRules="rules.provider"
|
:validationRules="rules.provider"
|
||||||
:additionalButtonData="additionalButtonData" />
|
:additionalButtonData="additionalButtonData" />
|
||||||
<alert
|
<alert
|
||||||
v-if="providers?.length === 0 ?? true"
|
v-if="providers?.length === 0 ?? true"
|
||||||
id="alertNoNetworkProviders"
|
id="alertNoNetworkProviders"
|
||||||
:cmsWidgetName="widget.noNetworkShopsAlert"
|
:cmsWidgetName="widget.noNetworkShopsAlert"
|
||||||
alertClass="alert-warning"
|
alertClass="alert-warning"
|
||||||
:isDismissible="false"
|
:isDismissible="false"
|
||||||
:manualHeadline="noNetworkShopsAlertHeaderText" />
|
:manualHeadline="noNetworkShopsAlertHeaderText" />
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="text-center">
|
class="text-center">
|
||||||
<textLink
|
<textLink
|
||||||
id="preferredShopNotListedLink"
|
id="preferredShopNotListedLink"
|
||||||
linkType="navigation"
|
linkType="navigation"
|
||||||
href="#!"
|
href="#!"
|
||||||
:text="shopNotListedModalLink"
|
:text="shopNotListedModalLink"
|
||||||
@clickEvent="doNotSeeMyShopLinkClick" />
|
@clickEvent="doNotSeeMyShopLinkClick" />
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<siteFooter
|
|
||||||
ref="siteFooter"
|
|
||||||
:cmsWidgetName="widget.siteFooter"
|
|
||||||
:isForwardActionDisabled="!meta.valid"
|
|
||||||
@ForwardClicked="forwardButtonAction"
|
|
||||||
@backClicked="backButtonAction" />
|
|
||||||
</div>
|
</div>
|
||||||
</Form>
|
<siteFooter
|
||||||
</div>
|
ref="siteFooter"
|
||||||
|
:cmsWidgetName="widget.siteFooter"
|
||||||
|
:isForwardActionDisabled="!meta.valid"
|
||||||
|
@ForwardClicked="forwardButtonAction"
|
||||||
|
@backClicked="backButtonAction" />
|
||||||
|
</div>
|
||||||
|
</Form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue