Dialog not showing, help

[Leocrydis]

Question

Hello, i have an issue where i have two dialogs. that display cards one is to display an svg that out puts a pdf (this works) and the other dialog to view pdfs but the pdf_preview.py is not loading the pdf_previewer (doesnt work). i am still new to python coding so i dont know if the reason is in plain sight but ive been stuck on this for more than i would like.

from nicegui import ui, app

def dialog_1():
    # Dialog for viewing the report
    with ui.dialog() as report_dialog:
        with ui.card().classes('p-4').style('width: 650px; max-width: 90%;'):
            # Display the SVG preview inside a bordered HTML container
            report_preview = ui.html().classes('border-2 border-gray-500 rounded-md mb-2').style('width: 612px; height: 792px;')

    report_dialog.open()

def dialog_2():
    with ui.dialog() as pdf_dialog:
        with ui.card().style("width: 700px; height: 600px; overflow-y: auto;").classes("p-4"):
            # Display each page of the PDF as an image
                ui.image("image_path").style("max-width: 100%; height: auto; margin-bottom: 10px;")

    pdf_dialog.open()

with ui.row().classes('w-full m-4'):
    with ui.button(icon='menu').classes('h-14'):
        ui.tooltip('Menu').classes('bg-green')
        with ui.menu() as menu:
            ui.menu_item('View PDF', on_click= lambda: dialog_2()).props('icon=page_view')
            ui.menu_item('Settings').props('icon=folder_open')
            ui.menu_item('Close', menu.close())

    with ui.button(text='Select File', icon='folder_open').classes('h-14'):
        with ui.menu():
            with ui.menu_item(on_click='xml_file_selection').props():
                ui.avatar(icon='file_open')
                ui.label('XML File').classes('my-auto ml-2')
            with ui.menu_item(on_click='csv_file_selection').props():
                ui.avatar(icon='file_open')
                ui.label('CSV File').classes('my-auto ml-2')

    ui.button(icon='work_history', on_click=lambda: dialog_1()).classes('h-14')

ui.run(native=True, reload=False)

[falkoschindler]

Hi @Leocrydis,

Can you, please, try to create a minimum reproducible code example? This would allow us and the community to help more efficiently. Thanks!
Why is it important to provide a minimal reproducible example?

[Leocrydis]

Sorry about that, i updated the original question but i noticed now that it will open but not all the time and its delayed and super slow when it does open.

[falkoschindler]

@Leocrydis I see. It boils down to the following example:

def show_dialog():
    with ui.dialog() as dialog:
        with ui.card():
            ui.label('Dialog')
    dialog.open()

with ui.button('Menu'):
    with ui.menu():
        ui.menu_item('Show dialog', on_click=show_dialog)

As discussed in #1852 (comment), the dialog is created inside the menu. So when clicking the menu item, which closes the menu, the dialog is hidden as well.

You can either create the dialog outside the click handler and re-use it, or explicitly create the dialog outside the menu:

def show_dialog():
    with ui.context.client.content:
        with ui.dialog() as dialog:
            with ui.card():
                ui.label('Dialog')
    dialog.open()

with ui.button('Menu'):
    with ui.menu():
        ui.menu_item('Show dialog', on_click=show_dialog)

[Leocrydis]

Thank you that worked!