Question

I have js following code. createNote() function is called when I click a “Crate Note” button on webpage

function createNote() {
   alert( 'page created' );        // for example note is created here
   window.location = document.URL; // refresh page to show new added note
   showEditNotePopup(); 
}

function showEditNotePopup() { 
  alert( 'show note edit page' );  // for example edit note popup shown here
}

Above code is working and creating note and also refreshing page using window.location = document.URL;. But after reloading page it is not calling showEditNotePopup() function. Is there any way to achieve this without using AJAX.

Answer 1

What happens here, is that, you are sending a completely new HTTP Request to the server using window.location. Thus, it’s not possible to do that. However, there are some workarounds. I’ll write them here:

One way is to send another parameter to the server on window.location. For example:

window.location = document.URL + "?popup=true";

Now, on the server, check this parameter. If it exist, then create a self-invoked function to show the newly created note’s info.

Another approach is to use ajax, instead of full request. This way, your function would be:

function createNote() {
   alert( 'page created' );        
   // use ajax to store new page, and update the UI accordingly
   showEditNotePopup(); 
}

Now, showEditNotePopup(); works like a charm.