javascript reload and display message

Question

Hi,

I want to reload page after deleting a row from table, and then display message, below is the javascript code,

if(action == 'delete'){
  window.location.reload(true);
  //tried to set timeout here, no luck :(
  document.getElementById('messageSpan').innerHTML = "The value has been deleted."; 
}

It seems that the reload function is executed after the 'messageSpan' content has been changed, so the reload function wipes out the 'messageSpan' content.

I need help

Thanks a lot,

Del

Answer 1

If you are trying to show the message for a defined period of time and then reload the page, you can use the setTimeout function:

if(action == 'delete'){
  document.getElementById('messageSpan').innerHTML = "The value has been deleted."; 

  setTimeout(function () { // wait 3 seconds and reload
    window.location.reload(true);
  }, 3000);
}

Note that your message will be visible only for those three seconds, it will disappear when the page reloads.

Answer 2

Reloading the page will destroy the state of the page and thus the user will never see the message HTML because it gets reset by the page reload.

Answer 3

Let me explain what I want here,

1, delete a row in table in my page. This deletion will delete record in database table. 2, I want to reload page to reflect previous deletion. 3, then display successful message in 'messageSpan' element. (Originally, the content of 'messageSpan' is empty)

in my code: if(action == 'delete'){ window.location.reload(true); //tried to set timeout here, no luck :( document.getElementById('messageSpan').innerHTML = "The value has been deleted."; }

I saw that the content of 'messageSpan' element had been changed, and then been cleared by reload. But, window.location.reload should be executed before I changed 'messageSpan' content. Am I right?

Thanks

Del

Answer 4

don't use reload. use the query string to pass a value back to your page to tell it whether the delete operation was successful or not

i.e. self.location.href = "yourPage.html?result=success"

your page should then check for the result query string item and display the appropriate message.

but have a look at jquery and ajax, you might not have to do the postback at all to refresh your grid