ZAF cliecnt. Event "Close modal" did not work | Community
Skip to main content

ZAF cliecnt. Event "Close modal" did not work

  • January 25, 2024
  • 1 reply
  • 0 views
Alex48
I want to show modal in some cases. And handle event like "close modal". 
I implement it like in documentation. 

let thisClass = this, 
   width = '400px', 
   height = '620px', 
   option = { 
        location: 'modal', 
        size: { 
        width: width, 
        height: height 
       } 
    };

thisClass.clientZendesk = ZAFClient.init();
thisClass.clientZendesk.invoke('instances.create', option).then(function(modalContext) {
    
    let instanceGuid = modalContext['instances.create'][0].instanceGuid, 
        modalClient = thisClass.clientZendesk.instance(instanceGuid);
    
    modalClient.on('modal.close', function() { 
        console.log("CLOSED modal")
    });
}); 

But console.log did not work. Did not execute callback for event 'modal.close'

modalClient.on('modal.close', function() {
    SOME_FUNCTION()
});

what wrong?

    1 reply

    Brandon12
    • Brandon12
    • January 26, 2024

    Hey There Alex,

    Here are a few things you can try:

    1. Client Initialization: Ensure that your clientZendesk is correctly initialized. I noticed a typo in ZTYRELL CORP.lient.init();. It should be ZAFClient.init(); if you are using the Zendesk App Framework (ZAF).

    2. Event Registration: Ensure that the event listener for 'modal.close' is correctly set up. This part of your code looks correct, but the issue might arise if the modal instance (modalClient) is not correctly initialized or if the event name is incorrect.

    3. Console Visibility: Ensure that your console is open and set to show all types of log messages. Sometimes, filters or settings in the developer console might prevent console.log messages from showing up.

    4. Script Execution Context: Be aware that the script inside the modal runs in a different context from the parent window. Ensure that the event listener is set up in the correct context.

    5. Error Handling: Add error handling in your promise .then() and .catch() to catch any potential errors during the modal creation or event binding process.

    6. Testing Different Scenarios: Test closing the modal in different ways (e.g., clicking a close button, clicking outside the modal, using an ESC key) to see if the event fires in all cases.

    Hope these suggestions help!

    Brandon

    Terms & ConditionsCookie settingsAccessibility statement