diff --git a/src/components/FormTime.vue b/src/components/FormTime.vue
index 1aeca3a..c299e4f 100644
--- a/src/components/FormTime.vue
+++ b/src/components/FormTime.vue
@@ -229,6 +229,7 @@ onMounted(() => {
                 outlined
                 lazy-rules
                 :max-date="dateNow"
+                :teleport="true"
               >
                 <template #year="{ year }">
                   {{ year + 543 }}
diff --git a/src/components/ToolBar.vue b/src/components/ToolBar.vue
index e2af5b4..ab54d66 100644
--- a/src/components/ToolBar.vue
+++ b/src/components/ToolBar.vue
@@ -108,7 +108,7 @@ onMounted(() => {
   <div class="items-center col-12 row q-pb-sm">
     <datepicker
       v-if="tab === 'history'"
-      menu-class-name="modalfix"
+      :teleport="true"
       v-model="filterYear"
       class="col-xs-5 col-sm-3 col-md-2"
       :locale="'th'"
@@ -146,7 +146,6 @@ onMounted(() => {
 
     <datepicker
       v-else-if="tab === 'time'"
-      menu-class-name="modalfix"
       v-model="dateMonth"
       class="col-xs-5 col-sm-3 col-md-2"
       :locale="'th'"
@@ -155,6 +154,7 @@ onMounted(() => {
       :transitions="false"
       :enableTimePicker="false"
       @update:modelValue="filterYearFn('month')"
+      :teleport="true"
     >
       <template #year="{ year }">{{
         Number.isFinite(year) ? year + 543 : ''