This is an automated email from the ASF dual-hosted git repository.
dahn pushed a commit to branch 4.19
in repository https://gitbox.apache.org/repos/asf/cloudstack.git
The following commit(s) were added to refs/heads/4.19 by this push:
new ca6d2dc57ec Prevent multi-select dropdown menu from floating on
scrolling through the form (#11237)
ca6d2dc57ec is described below
commit ca6d2dc57ecca52d3a0847038bc9c6e8c7a0c00a
Author: Pearl Dsilva <pearl1...@gmail.com>
AuthorDate: Mon Jul 28 05:20:42 2025 -0400
Prevent multi-select dropdown menu from floating on scrolling through the
form (#11237)
---
ui/src/views/offering/AddComputeOffering.vue | 9 +++++++++
ui/src/views/offering/AddDiskOffering.vue | 4 ++++
ui/src/views/offering/AddNetworkOffering.vue | 3 +++
ui/src/views/offering/AddVpcOffering.vue | 3 +++
4 files changed, 19 insertions(+)
diff --git a/ui/src/views/offering/AddComputeOffering.vue
b/ui/src/views/offering/AddComputeOffering.vue
index 80d200f1f25..ddf000d6f00 100644
--- a/ui/src/views/offering/AddComputeOffering.vue
+++ b/ui/src/views/offering/AddComputeOffering.vue
@@ -47,6 +47,7 @@
<tooltip-label :title="$t('label.systemvmtype')"
:tooltip="apiParams.systemvmtype.description"/>
</template>
<a-select
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.systemvmtype"
showSearch
optionFilterProp="label"
@@ -214,6 +215,7 @@
<tooltip-label :title="$t('label.deploymentplanner')"
:tooltip="apiParams.deploymentplanner.description"/>
</template>
<a-select
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.deploymentplanner"
showSearch
optionFilterProp="label"
@@ -245,6 +247,7 @@
</a-form-item>
<a-form-item name="pcidevice" ref="pcidevice" :label="$t('label.gpu')"
v-if="!isSystem">
<a-select
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.pcidevice"
showSearch
optionFilterProp="label"
@@ -260,6 +263,7 @@
</a-form-item>
<a-form-item name="vgputype" ref="vgputype"
:label="$t('label.vgputype')" v-if="vGpuVisible">
<a-select
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.vgputype"
showSearch
optionFilterProp="label"
@@ -281,6 +285,7 @@
</template>
<a-select
mode="multiple"
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.domainid"
showSearch
optionFilterProp="label"
@@ -305,6 +310,7 @@
<a-select
id="zone-selection"
mode="multiple"
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.zoneid"
showSearch
optionFilterProp="label"
@@ -331,6 +337,7 @@
<tooltip-label :title="$t('label.vmware.storage.policy')"
:tooltip="apiParams.storagepolicy.description"/>
</template>
<a-select
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.storagepolicy"
:placeholder="apiParams.storagepolicy.description"
showSearch
@@ -519,6 +526,7 @@
</template>
<a-select
mode="tags"
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.storagetags"
showSearch
optionFilterProp="value"
@@ -558,6 +566,7 @@
<br /><br />
<a-form-item :label="$t('label.disk.offerings')"
name="diskofferingid" ref="diskofferingid">
<a-select
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.diskofferingid"
:loading="loading"
:placeholder="$t('label.diskoffering')">
diff --git a/ui/src/views/offering/AddDiskOffering.vue
b/ui/src/views/offering/AddDiskOffering.vue
index 576721d48cc..700e90f1766 100644
--- a/ui/src/views/offering/AddDiskOffering.vue
+++ b/ui/src/views/offering/AddDiskOffering.vue
@@ -202,6 +202,7 @@
<tooltip-label :title="$t('label.storagetags')"
:tooltip="apiParams.tags.description"/>
</template>
<a-select
+ :getPopupContainer="(trigger) => trigger.parentNode"
mode="tags"
v-model:value="form.tags"
showSearch
@@ -226,6 +227,7 @@
</template>
<a-select
mode="multiple"
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.domainid"
showSearch
optionFilterProp="label"
@@ -250,6 +252,7 @@
<a-select
id="zone-selection"
mode="multiple"
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.zoneid"
showSearch
optionFilterProp="label"
@@ -273,6 +276,7 @@
<tooltip-label :title="$t('label.vmware.storage.policy')"
:tooltip="apiParams.storagepolicy.description"/>
</template>
<a-select
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.storagepolicy"
:placeholder="apiParams.storagepolicy.description"
showSearch
diff --git a/ui/src/views/offering/AddNetworkOffering.vue
b/ui/src/views/offering/AddNetworkOffering.vue
index 17359e4e0c0..435952413cd 100644
--- a/ui/src/views/offering/AddNetworkOffering.vue
+++ b/ui/src/views/offering/AddNetworkOffering.vue
@@ -248,6 +248,7 @@
<tooltip-label :title="$t('label.serviceofferingid')"
:tooltip="apiParams.serviceofferingid.description"/>
</template>
<a-select
+ :getPopupContainer="(trigger) => trigger.parentNode"
showSearch
optionFilterProp="label"
v-model:value="form.serviceofferingid"
@@ -430,6 +431,7 @@
</template>
<a-select
mode="multiple"
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.domainid"
showSearch
optionFilterProp="label"
@@ -454,6 +456,7 @@
<a-select
id="zone-selection"
mode="multiple"
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.zoneid"
showSearch
optionFilterProp="label"
diff --git a/ui/src/views/offering/AddVpcOffering.vue
b/ui/src/views/offering/AddVpcOffering.vue
index 738a03a9b2e..94a5f8a60b1 100644
--- a/ui/src/views/offering/AddVpcOffering.vue
+++ b/ui/src/views/offering/AddVpcOffering.vue
@@ -104,6 +104,7 @@
<tooltip-label :title="$t('label.serviceofferingid')"
:tooltip="apiParams.serviceofferingid.description"/>
</template>
<a-select
+ :getPopupContainer="(trigger) => trigger.parentNode"
showSearch
optionFilterProp="label"
v-model:value="form.serviceofferingid"
@@ -126,6 +127,7 @@
</template>
<a-select
mode="multiple"
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.domainid"
showSearch
optionFilterProp="label"
@@ -150,6 +152,7 @@
<a-select
id="zone-selection"
mode="multiple"
+ :getPopupContainer="(trigger) => trigger.parentNode"
v-model:value="form.zoneid"
showSearch
optionFilterProp="label"
