Properties

• Modal.fade: (bool) If True modal is animated

• Modal.centered: (bool) If True modal is vertically centred

• Modal.scrollable: (bool) If True modal is scrollable

• Modal.buttons: (list) Contains all buttons added using Modal.set_buttons()

Methods

• Modal.show(): Makes the modal visible (modals are invisible by default)

• Modal.hide(): Makes the modal invisible (modals are invisible by default)

• Modal.set_title(*nodes): Sets the modal title

• Modal.set_body(*nodes): Sets the modal body

• Modal.set_buttons(*buttons): Sets the modal buttons (set buttons are available in Modal.buttons)

Example

from lona_bootstrap_5 import Modal, PrimaryButton
from lona import LonaView, LonaApp
from lona.html import HTML, H1

app = LonaApp(__file__)


@app.route('/')
class MyModalView(LonaView):
    def handle_request(self, request):
        modal = Modal()

        html = HTML(
            H1('My Modal'),
            PrimaryButton('Open Modal', _id='open-modal'),
            modal,
        )

        self.show(html)

        # wait for button to be clicked
        self.await_click()

        # button was clicked; show modal
        with html.lock:
            modal.set_title('My Modal')
            modal.set_body('Lorem Ipsum')

            modal.set_buttons(
                PrimaryButton('Close')
            )

            modal.show()

        self.show(html)

        # wait for modal button to be clicked
        self.await_click(modal.buttons)

        # modal button was clicked; hide modal
        modal.hide()

        return html


app.run(port=8080)

Properties

• Modal.background: (str) [‘’|success|info|warning|danger]

• Modal.value: (int) Current progress value between 0 and 100

• Modal.striped: (bool) Enables Bootstraps striped style

• Modal.animated: (bool) Enables Bootstrap animations

Methods

• Modal.set_labal(*nodes): Sets label

• Modal.set_percentage(percentage): Sets the value the given value and calls Modal.set_label()