Calendar within a dialog

UI Components for Vue
Post Reply
dopi
Posts: 8
Joined: 27 Aug 2020, 11:17

11 Nov 2020, 17:04

Hi all,

I have a calendar component within a dialog. When the user opens the calendar, the calendar remains within the dialog and since the dialog is small the calendar is not correcly visualized and cannot be used.

Here the code that is very simple:

Code: Select all

<Dialog header="Header" v-model:visible="displayDialog" >
            <h5>Input1</h5>
            <InputText type="text" v-model="value1" />
            <h5>Input2</h5>
            <Calendar :showIcon="true"></Calendar>
</Dialog>
I would like to open it on top of the dialog nevertheless the dialog is small. I tried to fix it with the z-index, but it does not work. Any advice on how can I solve this?

Thanks a lot!

mert.sincan
Posts: 4484
Joined: 29 Jun 2013, 12:38

12 Nov 2020, 00:40

Hi,

Thanks a lot for the sample code block! Please try appendTo="body" on Calendar.

Best Regards,

dopi
Posts: 8
Joined: 27 Aug 2020, 11:17

12 Nov 2020, 10:07

I added appendTo and it works perfectly. Thank you very much!

mert.sincan
Posts: 4484
Joined: 29 Jun 2013, 12:38

12 Nov 2020, 10:18

You're welcome!

Best Regards,

Post Reply

Return to “PrimeVue”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest