Home/ Questions/Q 160825
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-11T11:06:13+00:00

I am not a big web programmer, and have a friend who wants me

  • 0

I am not a big web programmer, and have a friend who wants me to help him with something.

He wants to be able to have a form that once it is submitted changes to say something like ‘Thanks for submitting’ and have the form info disappear. He wants it to be easy for anyone to use, so he can give it to various people to use on their sites.

I was thinking I could use javascript to do it, but not really 100% sure. I want to avoid anything that isn’t HTML as much as possible so that it will be usable by as many people as possible.

Thanks.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. What is supposed to happen to the information in the form? Doesn’t matter?

    If you want it to be pure HTML there’s only one good solution: Write one HTML page with the form, and another almost identical one with the success message in place and the form data hidden. Simple.

    On the submitting side:

    <h1>Email Subscription:</h1> <form action='successForm.html'> <input type='text' name='emailAddress' /> <button type='submit'>Send Info</button> </form>

    On the receiving side (successForm.html)

    <h1>Email Subscription:</h1> <p>Great job, you submitted!</p>

    However, if you need something to change on the very same page, you’re going to have to use something non-HTML. HTML just won’t make any decisions about what to display. It is dumb… it just displays.

    It’s very easy to use JavaScript to detect when the form was submitted, and then hide the elements you need to hide, and show the success message:

    <!-- Goes in the <head> or in a seperate script --> <script type='text/javascript'>     var theSubmitButton = document.getElementById('formSubmit');      theSubmitButton.onclick = function() {         var theFormItself =              document.getElementById('theForm');         theFormItself.style.display = 'none';         var theSuccessMessage =              document.getElementById('successMessage');           theSuccessMessage.style.display = 'block';               } </script>  <!-- Goes in the body --> <h1>Email Subscription:</h1> <p id='successMessage'>You submitted the form, good job!</p> <form id='theForm' action='successForm.html'>     <input type='text' name='emailAddress' />     <button id='formSubmit' type='submit'>Send Info</button> </form>

    Of course, this example is oversimplified. It doesn’t do anything with the data, and it doesn’t follow best practices, or check that the data is valid in any way. I’m just trying to give a basic idea of how to use JavaScript for this purpose. If you’re not a programmer, then coming up with a small, distributable piece of software might be a good job for someone else.

    However, you still need some mechanism to store, email or otherwise DO something with the form. Add an edit to your question and I’ll be happy to clarify my answer with a specific example.

    (Another note, I didn’t try to run that Javascript, so if you see an error, please just note and I’ll fix it)

    • 0