209
Views
4
Comments
Solved
How to execute an action after pressing "Esc" key when hiding a sidebar?
Question

I'm developing a traditional web application using service studio 11.8.7.

Is there any way to execute a screen action when the "Esc" key is pressed to close the Sidebar Modal?

Because the "Esc" hides the modal but without executing the same screen action that the "X" icon does.

I need a way to make the "Esc" button acts same as when a user closes the modal by clicking the "X" icon.

2022-10-16 15-30-09
Miguel Chaparra
Solution

Hi Hasan,


I think you can achieve this by using JavaScript, add a listener and when the Esc key is pressed you trigger the click of your X button/link.

"document.onkeydown = function(evt) {
    evt = evt || window.event;
    if (evt.keyCode == 27) {
        document.getElementById('"+x.Id+"').click();
    }
};"

I based myself on this code: https://jsfiddle.net/m9w8m/ 


Hope it helps!


Regards,

Miguel Chaparra

2023-09-01 08-29-06
Hasan Derawan
Staff

Miguel Chaparra wrote:

Hi Hasan,


I think you can achieve this by using JavaScript, add a listener and when the Esc key is pressed you trigger the click of your X button/link.

"document.onkeydown = function(evt) {
    evt = evt || window.event;
    if (evt.keyCode == 27) {
        document.getElementById('"+x.Id+"').click();
    }
};"

I based myself on this code: https://jsfiddle.net/m9w8m/ 


Hope it helps!


Regards,

Miguel Chaparra

 

Thanks Miguel!

That works fine. I just need to mention something for the readers of this answer. Toggling the modal is executed twice now, one by the default behavior of the "Esc" button, and the other is inside the "X" button screen action. I fixed that by adding a hidden link in the screen and assigning it to the same screen action of the "X" button but with passing a new input parameter as an indicator to prevent hiding it twice.

2023-09-01 08-29-06
Hasan Derawan
Staff

Another note, I noticed that the id of the link is changeable. So I recommend to add an extended attribute (Name) and do 

document.getElementsByName('"+x.Id+"')[0].click();

instead of the Id, because it's not fixed all time.

2022-10-16 15-30-09
Miguel Chaparra

Thank you Hasan for your extra notes. It surely will help others :)


Regards,

Miguel Chaparra


Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.