Getting multiple modals opening due to long running calls

Hi,

I'm looking for ways to improve on a lagging user experience due to external factors within the environment that we have.

We have a Traditional Web application which is a front end to a legacy system and consumes REST API's for most of the data that it displays.

The environment isn't ideal and often these API calls take several seconds to execute, and over 10 seconds is not uncommon sometimes. In addition to this the forms are complex with many server actions and ajax refreshes going on.

If the system starts to lag and a user clicks icons that will open 2 or more search modals for different fields then when things catch up they will all open at the same time. Ideally I'd like to only keep the last one.

In a Traditional Web when toggling a modal in the server action, is there a way to know that other modal links have been clicked and are currently queued so I can end the action, or alternatively close any currently open modals when a new opens?

The modals and links that open them are all in web blocks from another module and I can't find a way to easily tell them about the sate of the other modals or close one from within another. Any ideas or advice would be appreciated. 

Thank you.


Hi Nigel

I don't think so. The modals itself are using JavaScript to run, so you could investigate the component and see if you can adapt the JavaScript in a way that prevents the modals to open if another is already set to open. 

But this would mean for you to create a new component, basically... 

And would mean, forcibly, that you will have to change your producer modules. 

You could keep a variable at the screen level, that tells you if the user opened a Modal. In that case, you can prevent other modal of being opened. You would have to reset the variable when the modal is closed. 

The problem with this approach is that it will work only if the modals are triggered from the screen. If they are triggered from the blocks, you will have to change the blocks to alert the screen when the modal is opened or closed. 

Cheers 

Eduardo Jauch wrote:

Hi Nigel

I don't think so. The modals itself are using JavaScript to run, so you could investigate the component and see if you can adapt the JavaScript in a way that prevents the modals to open if another is already set to open. 

But this would mean for you to create a new component, basically... 

And would mean, forcibly, that you will have to change your producer modules. 

You could keep a variable at the screen level, that tells you if the user opened a Modal. In that case, you can prevent other modal of being opened. You would have to reset the variable when the modal is closed. 

The problem with this approach is that it will work only if the modals are triggered from the screen. If they are triggered from the blocks, you will have to change the blocks to alert the screen when the modal is opened or closed. 

Cheers 

 Thank you Eduardo,

I've had some luck using a session variable to track if a modal is open, but it means they can't open a modal on another tab at the same time. That may be the best I can do.

 

Solution

Using a session variable, in this context, will be very problematic for the user experience...

I would use a different approach. I don't know if you have the modals inside the blocks. But if the modals are in the screen, and the action to open the modals are in the screen as well, a local variable would work.

If not, refactoring to have the modals in the screen, even if the blocks are in other module, would solve the problem as you would be able to use a local variable.

If this is not possible, JavaScript would probably help, as even if inside OutSystems the blocks are isolated, in the browser it will be everything a big HTML file and JavaScript would be able to find the page "variable" and you could implement something like that, that would not be cool in terms of maintainability, but would solve the user experience issue...

Cheers.

Solution

Eduardo Jauch wrote:

Using a session variable, in this context, will be very problematic for the user experience...

I would use a different approach. I don't know if you have the modals inside the blocks. But if the modals are in the screen, and the action to open the modals are in the screen as well, a local variable would work.

If not, refactoring to have the modals in the screen, even if the blocks are in other module, would solve the problem as you would be able to use a local variable.

If this is not possible, JavaScript would probably help, as even if inside OutSystems the blocks are isolated, in the browser it will be everything a big HTML file and JavaScript would be able to find the page "variable" and you could implement something like that, that would not be cool in terms of maintainability, but would solve the user experience issue...

Cheers.

 Thank you for you help. I can't refactor onto the screen because these modals are re-used in different places but I've been able to use JavaScript to close the other modals when a new one opens. This give me a result that's pretty close to what I'm looking for.

 Cheers