0

I have a form to let people submit news articles to my site (a company intranet). Sometimes the form submission takes a few seconds to resolve due to some actions I have in place on the relevant model save method. I wanted to replace the text on the form page with a message saying "Sending your article. This may take a few seconds, please do not refresh the page." as soon as someone hits submit. I've seen these on a number of websites when buying things online.

My first attempt at doing this was to add an onClick event to the form button. Submitting then successfully replaced the text but did not submit the form. I had a look at this answer on binding two events to one submit button but it doesn't seem to address my need as it looks PHP-specific. I'm certain javascript is the right tool for the job but I can't think of how to do this other that binding to clicking the submit button. Does anyone know the correct way to do this?

Community
  • 1
  • 1
cms_mgr
  • 1,977
  • 2
  • 17
  • 31

1 Answers1

4

JavaScript is indeed the right way to do so. If you are using jQuery you can go ahead and use something like:

$('form#your-form-id').submit(function(){
    $(this).hide().after('Loading, please wait...');
});

Where #your-form-id would be the id of the form. This function is hiding the form content and showing that text, you could do anything instead actually.

aurbano
  • 3,324
  • 1
  • 25
  • 39