gmarth/NiceGUIEx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed dialog classmethod

Browse Source
This commit is contained in:
Alexander Thiess
2025-09-23 04:37:56 +02:00
parent baaa2d4349
commit 1012cf3d73
2 changed files with 123 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
example_async_dialog.py
View File

@@ -2,29 +2,30 @@
"""Example demonstrating the AsyncElement.as_dialog() method"""
from nicegui import ui
from src.niceguiex.async_elements import AsyncElement
from src.niceguiex.async_elements import AsyncColumn
class ConfirmDialog(AsyncElement[ui.column]):
class ConfirmDialog(AsyncColumn):
"""A confirmation dialog that can be awaited for a result"""
async def build(self, message: str, title: str = "Confirm"):
"""Build the dialog content"""
with self._element:
ui.label(title).classes('text-h6')
ui.label(message)
ui.space()
ui.label(title).classes('text-h6')
ui.label(message)
ui.space()
with ui.row().classes('full-width justify-end'):
ui.button('Cancel', on_click=lambda: self._dialog.submit(False))
ui.button('OK', on_click=lambda: self._dialog.submit(True)).props('color=primary')
with ui.row().classes('full-width justify-end'):
ui.button('Cancel', on_click=lambda: self._dialog.submit(False))
ui.button('OK', on_click=lambda: self._dialog.submit(True)).props('color=primary')
class FormDialog(AsyncElement[ui.column]):
class FormDialog(AsyncColumn):
"""A form dialog that collects user input"""
async def build(self, title: str = "Enter Information"):
"""Build the form dialog"""
ui.label(title).classes('text-h6')
# Create input fields
name_input = ui.input('Name', placeholder='Enter your name')
email_input = ui.input('Email', placeholder='Enter your email')
@@ -32,11 +33,16 @@ class FormDialog(AsyncElement[ui.column]):
ui.space()
with ui.row().classes('full-width justify-end'):
ui.button('Cancel', on_click=lambda: self._dialog.submit(None))
ui.button('Submit', on_click=lambda: self._dialog.submit({
'name': name_input.value,
'email': email_input.value
})).props('color=primary')
# Check if we're in dialog mode (self._dialog exists)
if hasattr(self, '_dialog'):
ui.button('Cancel', on_click=lambda: self._dialog.submit(None))
ui.button('Submit', on_click=lambda: self._dialog.submit({
'name': name_input.value,
'email': email_input.value
})).props('color=primary')
else:
# Normal mode - just show submit button that displays the values
ui.button('Submit', on_click=lambda: ui.notify(f"Name: {name_input.value}, Email: {email_input.value}")).props('color=primary')
@ui.page('/')
@@ -44,6 +50,27 @@ async def main():
ui.label('AsyncElement Dialog Examples').classes('text-h4')
ui.separator()
# Example: Same component used both normally and as dialog
with ui.row():
with ui.column():
ui.label('Normal usage (inline):').classes('text-subtitle1')
# Use FormDialog normally inline on the page
await FormDialog.create(title="Inline Form")
with ui.column():
ui.label('Dialog usage:').classes('text-subtitle1')
async def show_form_dialog():
result = await FormDialog.as_dialog(title="Dialog Form")
if result:
ui.notify(f'Form submitted: {result}', type='positive')
else:
ui.notify('Form cancelled', type='warning')
ui.button('Open as Dialog', on_click=show_form_dialog)
ui.separator()
async def show_confirm():
result = await ConfirmDialog.as_dialog(
message="Are you sure you want to proceed?",
@@ -62,9 +89,9 @@ async def main():
ui.button('Show Confirmation Dialog', on_click=show_confirm)
ui.button('Show Form Dialog', on_click=show_form)
# Example with inline async element
# Example with inline async element using AsyncColumn
async def show_inline_dialog():
class QuickDialog(AsyncElement[ui.column]):
class QuickDialog(AsyncColumn):
async def build(self):
ui.label('Quick Question').classes('text-h6')
ui.label('Do you like this feature?')