Home/ Questions/Q 6353893
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-24T22:29:21+00:00

Hi I’m having some trouble getting this to work, pretty simple all I am

  • 0

Hi I’m having some trouble getting this to work, pretty simple all I am wanting to do is show a div once my html form is submitted.

<head>

<script type="text/javascript">
 function showHide() {
   var div = document.getElementById(hidden_div);
   if (div.style.display == 'none') {
     div.style.display = '';
   }
   else {
     div.style.display = 'none';
   }
 }
</script>

</head>


<body>

<form method="post" name="installer">

<label>Home Keyword</label>
<br />
<input type="text" name="hello" value="">
<br />
<input type="submit" value="" name="submit" onsubmit="showHide()">

</form>

<div id="hidden_div" style="display:none">
<p>Show me when form is submitted :) </p>
</div>

</body>

Any help would be much appreciated thank you 🙂

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I think you’re just missing quotes around “hidden_div” in your document.getElementById("hidden_div") call!

    But actually, your page is probably posting back, resetting the state of the page and thus leaving hidden_div seemingly always in a hidden state — are you intending on handling the form submission via AJAX?

    If you want to see the intended behavior, you should move the showHide() call to the <form> element, and return false after it:

    <form method="post" name="installer" onsubmit="showHide(); return false;">

    and leave the submit button as:

    <input type="submit" value="" name="submit" />

    Also note that you haven’t self-closed the <input /> button tag, or given any text to show inside it.

    • 0