Dynamic modal content (FastGridTemplate)

Panel
,
1

Hi. I’m trying to pop up a modal dialog with content that changes dynamically. I am using the FastGridTemplate. However, I can’t seem to register my changes to the modal content from a callback. I’ve read the docs which suggest the content areas are fixed once rendered, they suggest one wraps the content using a panel layout component (eg Row or Column) but I can’t seem to get this to work either. Below are three different attempts; all of which produce an empty modal. I’d expect a modal with a random number displayed in each case. Any one have any ideas? Perhaps I need to trigger a UI refresh or similar. An additional observation is if, after pressing the button for the modal popup and the modal appearing empty, I force refresh the browser page (f5) and press button again, then the dialog is populated (hence my trigger UI refresh suspicion).

import panel as pn
import random

# attempt 1
# template = pn.template.FastGridTemplate(title='Modal Test 1')

# def show_modal(event):
#     template.modal.clear()
#     template.modal.append(f"Randint {random.randint(0, 100)}")
#     template.open_modal()


# attempt 2
# template = pn.template.FastGridTemplate(title='Modal Test 2', modal=pn.Row())

# def show_modal(event):
#     template.modal.objects.clear()
#     template.modal.objects.append(f"Randint {random.randint(0, 100)}")
#     template.open_modal()


# attempt 3
def create_modal():
    return pn.Row()

template = pn.template.FastGridTemplate(title='Modal Test 3', modal=create_modal())

def show_modal(event):
    template.modal.objects.clear()
    template.modal.objects.append(f"Randint {random.randint(0, 100)}")
    template.open_modal()


# common
modal_btn = pn.widgets.Button(name="Click for modal")
modal_btn.on_click(show_modal)
template.sidebar.append(modal_btn)

template.show()
2

I found the solution. The clue was in question #5382. The following now works.

template = pn.template.FastGridTemplate(title='Modal Test 4')
template.modal.append(pn.Row())

def show_modal(event):
    template.modal[0].clear()
    template.modal[0].append(f"Randint {random.randint(0, 100)}")
    template.open_modal()