Modal as part of component

Hi there,

I am trying to create a component that I can use in different contexts.

I managed to define a collection paramater, to bind the correct Xano collection for each context. So I am able to contextually render the correct data in a data list (table). The table is using the same column structure for each context.

In the component I have added a Button to add a new record to the data list. I want to trigger a modal with a simple form. But I am not able to add the Modal in the component, because the modal is based on a section.

As a workaround I added a variable that is exposed outside of the component to show the modal.

Now I need to add the Modal on page level. But I prefer to have the modal being part of the component itself, because this would make the elements used on the page where I want to use the component and memory usage of the editor more efficient.

Furthermore, the variable that is exposed outside of the component is available to be assigned in the display property of the modal section, but it is not available in the workflow on the modal on page level. For example: I can’t change to exposed variable value on the close icon of the modal.

Questions I have:

  • Is there a way or workaround to have a modal like functionality on component level?
  • Is it possible to have access to exposed component variables in workflows on page level?
1 Like

Did you find any solutions for this? We would also need that

Not yet. I did put de content of the modal in a component. But the modal itself is on the root page. It not ideal but it works for now.

1 Like

maybe @Joyce has an idea? :slight_smile: