Added onShownCallback property and handler

This commit is contained in:
Leah Schumann 2023-01-24 15:55:13 -05:00
parent 61e7c98141
commit 77d9c27971
2 changed files with 13 additions and 4 deletions

View file

@ -2,7 +2,7 @@
<!-- Modal -->
<div
class="modal fade modal-component"
v-on="{ 'hidden.bs.modal': resetButtonStyle }"
v-on="{ 'hidden.bs.modal': resetButtonStyle, 'shown.bs.modal': onShownCallback }"
:id="cmsWidgetName"
tabindex="-1"
aria-labelledby="ModalComponentLabel"
@ -49,6 +49,9 @@ export default {
name: "modal",
props: {
cmsWidgetName: String,
onShownCallback: {
type: Function,
},
footerButtonCallback: {
type: Function,

View file

@ -13,13 +13,13 @@
href="#!"
data-bs-toggle="modal"
:data-bs-target="getModalId"
aria-label="Modal window"
@click-event="onModalOpen" />
aria-label="Modal window" />
</div>
</div>
<modal
ref="zipCodeInputModal"
:cmsWidgetName="this.modalWidgetName"
:onShownCallback="onModalOpen"
:footerButtonCallback="setZip">
<div class="ps-4 pe-4 pb-4">
<textboxQuestion
@ -62,6 +62,7 @@ import textboxQuestion from "@/digital-components/textbox-question/textbox-quest
import { defineRule } from "vee-validate";
import { required, regex } from "@/helpers/validation-rules";
import { errorMessages } from "@/constants/error-messages";
import { isNoUnitNumericStyleProp } from "@vue/shared";
// Define Validation Rules
defineRule("zip-required", required(errorMessages.SERVICE_ZIP_REQUIRED));
@ -104,7 +105,12 @@ export default {
this.$refs.zipCodeInputModal.resetButtonStyle();
},
focusOnZipInput() {},
focusOnZipInput() {
this.$nextTick(() => {
const input = this.$refs.zipInputTextQuestion.$refs.serviceZipCodeInput;
input.focus();
});
},
onModalOpen() {
this.serviceZipCodeInput = this.serviceZip;