Updating onClick of the saveAs Button

[neel]

WebViewer Version:

Do you have an issue with a specific file(s)?N
Can you reproduce using one of our samples or online demos? N
Are you using the WebViewer server?N
Does the issue only happen on certain browsers?N
Is your issue related to a front-end framework?Y
Is your issue related to annotations?N

Please give a brief summary of your issue:
(Think of this as an email subject)
Save As Button on Click Handler can’t be updated with updateElement

Please describe your issue and provide steps to reproduce it:
(The more descriptive your answer, the faster we are able to help you)

This won’t log anything for me when I click the button

instance.UI.updateElement(‘saveAsButton’, {
onClick: () => {
console.log(‘clicked’);
},
});

Please provide a link to a minimal sample where the issue is reproducible:

[system]

Hello, I’m AiRon, an automated tech support bot
While you wait for one of our customer support representatives, I can help you with your question.

It seems you are trying to update the onClick handler for the “Save As” button using the updateElement method in Apryse’s WebViewer. However, updateElement is primarily used for updating certain properties of UI elements, and it does not support updating event handlers like onClick directly.

Some things you can try:

• Instead of using updateElement, directly access the button using the WebViewer instance and attach your event handler.


• Use the instance.UI.getElement method to retrieve the button and then add an event listener for the click event.


• Ensure that the WebViewer is fully initialized before attempting to modify UI components.

Here are some resources that might help you:

• Working with the Default UI: Learn how to customize the WebViewer UI, including adding and modifying elements.


• Save Annotations in Mendix: This guide shows how to handle save operations, which might give insights into handling events.


• View Documents Side-by-side: Understanding how to toggle features can provide insights into UI manipulation.


• Migrating to V10 of WebViewer: Ensure your setup aligns with the latest practices and APIs.


• How to upgrade to the new WebViewer version?: Make sure your version supports the methods you’re using.

Hopefully, this helps you solve your problem while you wait for a human to get back to you.

[kkim]

Hi there,

Starting in version 11, WebViewer now uses Modular-UI by default.
With this change, you will no longer be able to modify the preset buttons such as saveAsButton via updateElement.
However, you are able to freely create your own button, or create a preset button via our guide here:

Modular UI Items

Preset buttons do not allow overriding its onClick behaviour:

Modular UI Items

If you want to run additional logic on top of the default behaviour, you can use the setClickMiddleWare API:
https://sdk.apryse.com/api/web/UI.html#.setClickMiddleware

Best regards,
Kevin

[neel]

@kkim

l logic on top of the default behaviour, you can use the setClickMiddleWare API:

Is it possible for me to run logic pre+ post this button’s on Click? Also setClickMiddleware returns undefined on the save file button in the saveasmodal

[kkim]

Hi there,

The setClickMiddleware API is for setting a function before the default click handler, so it would not work post the onClick

It looks like the saveFile button returns undefined, we will add this to the backlog for the product team to review.

best regards,
Kevin