diff --git a/adminforth/spa/src/afcl/Dropzone.vue b/adminforth/spa/src/afcl/Dropzone.vue
index 1fcd5afa..4bada0a9 100644
--- a/adminforth/spa/src/afcl/Dropzone.vue
+++ b/adminforth/spa/src/afcl/Dropzone.vue
@@ -1,6 +1,6 @@
 <template>
     <!-- tag form used to reset the input (method .reset() in claer() function) -->
-  <form class="flex items-center justify-center w-full"
+  <form ref="form" class="flex items-center justify-center w-full"
     @dragover.prevent="dragging = true"
     @dragleave.prevent="dragging = false"
     @drop.prevent="dragging = false; doEmit($event.dataTransfer.files)"
@@ -125,12 +125,12 @@ function doEmit(filesIn: FileList) {
 }
 
 const dragging = ref(false);
+const form = ref<HTMLFormElement | null>(null);
 
 function clear() {
   selectedFiles.value = [];
   emit('update:modelValue', []);
-  const form = document.getElementById(id)?.closest('form');
-  form?.reset();
+  form.value?.reset();
 }
 
 defineExpose({