I have created a new page with a default calendar webpart.

Below is what I'm doing.

1. Click New Event and the popup gets opened
2. Fill-in the event details
3. Click Save and the event gets saved
4. Calendar gets reloaded asynchronously and my new get details are shown

Though the calendar gets reloaded automatically when an event is created, I would like to reload the entire screen once the event is created, as it requires due to my other customization.

I tried creating some script with some timeout to reload the screen, in the save button as below, but it doesn't get fired.

$("input[id$=SaveItem]").click(function(){
     setTimeout(function(){ parent.window.location.reload(); }, 3000);
});

I tried another approach which executes the same kind of script when the modal dialog of "newForm.aspx" form is closed. I tried the below, but it doesn't work either.

$('.ms-dlgContent').on('hidden', function(){
    alert('test');
});

document.getElementsByClassName('ms-dlgContent')[0].addEventListener('hide', function (event) {
     alert('Test 1');
 });
    
document.getElementsByClassName('ms-dlgContent')[0].addEventListener('hidden', function (event) {
     alert('Test 2');
    });
    

Is there any way I can reload my screen once the modal dialog is closed or an event is created?

I also tried to use the SP.UI.ModalDialog class, but I couldn't find much.