Issue #4273Opened April 20, 2022by boomshakar1 reactions

How to trigger the 'Import Template (modal)' on page load

Question

Hello, Please i'm in need of the logic on how to the import template modal on initialization of the page... I'm using the newsletter preset plugin

Code SnippetTEXT
What i'm trying to achieve?: Make the user upload their code once the page has been loaded.
Below are the logics I've tried,

`
editor.on('load',(model, argument )=> {

        //open modAL
        const modal = edit.Modal;
        const cmdd = edit.Commands;

        //filter using component name
        if (model.getName() === 'Import template') {  //not working
          //show modal
          modal.open();
        }

        edit.on('modal:', (a, b, c) => {  //not working
          console.log({ a });
          console.log({ b });
          console.log({ c });
        });

        cmdd.run('modal:import-template', (a, b, c) => {  //not working
          console.log({ a });
          console.log({ b });
          console.log({ c });
        });
}`

_Originally posted by @boomshakar in https://github.com/artf/grapesjs/discussions/4272_

Answers (3)

boomshakarApril 22, 20221 reactions

@boomshakar please don't convert discussions to issues

Noted. Thanks

boomshakarApril 21, 20220 reactions
Code SnippetTEXT
Hi @artf,
I was able to get what I want by triggering click() on the button itself, 

`

        const modal = edit.Modal;
        const query = new URLSearchParams(location.search);
        const uploadQuery = query.get('key');
        if (uploadQuery === 'upload-code') {
          const importClick = document.querySelector('.gjs-pn-btn.fa.fa-download');
          importClick.click();
          edit.on('modal', (e) => {
            if (e.open && e.title.textContent === 'Import template') {
              modal.setTitle('<div>Import your Template [inline-html/css]</div>');
            }
          });
        }
`

If there's a better workaround, i'd be glad If you share with me the knowledge.
Thanks.
artfApril 21, 20220 reactions

@boomshakar please don't convert discussions to issues

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.