Improved: added validations of character on Zipcodes(#255)

hotwax · May 3, 2024 · 90a1bde · 90a1bde
1 parent 06224e6
commit 90a1bde
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/src/components/FacilityAddressModal.vue b/src/components/FacilityAddressModal.vue
@@ -44,7 +44,7 @@
         </ion-select>
       </ion-item>
       <ion-item>
-        <ion-input label-placement="floating" v-model="address.postalCode">
+        <ion-input label-placement="floating" v-model="address.postalCode" @keydown="validateZipCode($event)">
           <div slot="label">{{ translate("Zipcode") }} <ion-text color="danger">*</ion-text></div>
         </ion-input>
       </ion-item>
@@ -149,6 +149,12 @@ export default defineComponent({
     closeModal() {
       modalController.dismiss()
     },
+    validateZipCode(e: any) {
+      if(/[`!@#$%^&*()_+=\\|,.<>?~{};:'"/]/.test(e.key)){
+        e.preventDefault();
+        return false;
+      } 
+    },
     async saveContact() {
       let resp, postalAddress = '';
 

diff --git a/src/components/FacilityGeoPointModal.vue b/src/components/FacilityGeoPointModal.vue
@@ -13,7 +13,7 @@
   <ion-content>
     <form @keyup.enter="saveGeoPoint">
       <ion-item class="ion-margin-bottom">
-        <ion-input aria-label="zipcode" :placeholder="translate('Zipcode')" v-model="geoPoint.postalCode" />
+        <ion-input aria-label="zipcode" :placeholder="translate('Zipcode')" v-model="geoPoint.postalCode" @keydown="validateZipCode($event)"/>
         <ion-button slot="end" fill="outline" @click="generateLatLong">
           {{ translate("Generate") }}
           <ion-icon v-if="!isGeneratingLatLong" slot="end" :icon="colorWandOutline" />
@@ -102,6 +102,12 @@ export default defineComponent({
     closeModal() {
       modalController.dismiss()
     },
+    validateZipCode(e: any) {
+      if(/[`!@#$%^&*()_+=\\|,.<>?~{};:'"/]/.test(e.key)){
+        e.preventDefault();
+        return false;
+      } 
+    },
     async generateLatLong() {
       if(!this.geoPoint.postalCode) {
         showToast("Please fill the required Zipcode")