Dropdown add modals not working, JS error

[hughbris]

Similar to #2132 , putting any add modal in the dropdown does nothing in the UI and generates the following JS error in the console:

Uncaught TypeError: can't access property "open", $[PLUGIN_NAME].lookup[$target.data(...)] is undefined

However, note also:

• with show_in: bar, the problem never happens (but the button isn't visible in all contexts, so not a great workaround)
• the error only happens in the context of editing pages, not in the pages navigator
• it's any add modal, for adding modules or pages (unlike #2132).

Firefox browser. Latest Admin and Grav core. Cheers.

[yhancik]

There are two things missing in https://github.com/trilbymedia/grav-plugin-flex-objects/blob/develop/admin/templates/flex-objects/types/pages/edit.html.twig that can actually be found in

• https://github.com/trilbymedia/grav-plugin-flex-objects/blob/develop/admin/templates/flex-objects/types/pages/list.html.twig

{% for key, add_modal in config.plugins.admin.add_modals %} {% if add_modal.show_in|default('bar') == 'bar' %} {{ add_modal.label|tu }} {% endif %} {% endfor %}

• and https://github.com/trilbymedia/grav-plugin-flex-objects/blob/develop/admin/templates/flex-objects/types/pages/list/columns.html.twig

{% for key, add_modal in config.plugins.admin.add_modals %}

{% include add_modal.template|defined('partials/blueprints-new.html.twig') with { blueprints: admin.blueprints(add_modal.blueprint), data: obj_data, form_id: 'add-modal' }|merge(add_modal.with|defined({})) %}

Adding these two parts in the right place in edit.html.twig seems to do the job.

I can't quite make a proper PR right now, nor do I really have the time to wait for the fix to potentially be pushed to the main branch, so if anyone has any suggestion on how I can put my changes into a personal plugin/theme, that'd be very welcome!

[yhancik]

I spoke too soon. The buttons show, the modal display... but it turns out that for reasons that escape me, the modal forms are populated by values from the page currently edited, regardless of what is defined in the YAML blueprint.

[n-vs-m]

Did you find a solution or workaround? I have the same problem here.

[yhancik]

Did you find a solution or workaround? I have the same problem here.

Alas not. Totally hit a wall there, I didn't find any documentation to help me further, and I had the wrap up the project so I gave up on those buttons.

[n-vs-m]

It seems i have something working. Adding this block:

      {# edit perso #}
       {% for key, add_modal in config.plugins.admin.add_modals %}
          <div class="remodal {{ add_modal.modal_classes|defined('') }}" data-remodal-id="modal-add_modal-{{ key }}" data-remodal-options="hashTracking: false, closeOnOutsideClick: false">
            {% include add_modal.template|defined('partials/blueprints-new.html.twig') with {
              form:null,
              blueprints: admin.blueprints(add_modal.blueprint),
              data: null,
              form_id: 'add-modal'
            }|merge(add_modal.with|defined({})) %}
          </div>
        {% endfor %}

at line 212/213 of this file (before the closing {% endif %}) :

https://github.com/trilbymedia/grav-plugin-flex-objects/blob/f2a044ab813198108f677b3b4844d6696dda9161/admin/templates/flex-objects/types/pages/edit.html.twig#L210C1-L216C1

[n-vs-m]

I opened an issue in the grav-plugin-flex-objects repo.