Matomo dialog / modal (developers)


(Erick Ramírez) #1

I don’t know for sure if it is documented, but I couldn’t find anything about how to use Matomo dialogs/modals. For those looking to implement, for example, a confirmation modal, do this:

In your twig:

<div class="ui-confirm" id="sendNotificationConfirm">
    <h2>{{ sendNotificationConfirm }}</h2>
    <input role="yes" type="button" value="{{ 'General_Yes'|translate }}"/>
    <input role="no" type="button" value="{{ 'General_No'|translate }}"/>
</div>

In your script (wrap the following into a function called by a click event or any event you prefer):

piwikHelper.modalConfirm(makeSelectorLastId('sendNotificationConfirm'), {
      yes:
      function () {
        // Code you want to be executed when the user hit "Yes"
      }
    });