2

I have simple HTML form with submit button. After hitting this button I would like to the see div#my_id which is not visible before.

<input type="submit" name="xxx" value="yyy" onclick="document.getElementById('my_id').style.display = 'block' ;"> <div id="my_id" style="display: none"> My text </div> 

How can I make it work?

4
  • 1
    @Jennifer This question is not about jQuery. Commented Jul 23, 2015 at 12:27
  • as you do it on submit button click then defiantly your page goes refresh...if your page refresh then you get again load your page. Commented Jul 23, 2015 at 12:30
  • you can refer this link : stackoverflow.com/questions/21070101/… Commented Jul 23, 2015 at 12:31
  • 3
    To everyone, stop posting random "solutions" since his own code actually works. So stop going for jQuery or even other JS 'fixes' since that is actually not even the problem. Good chance his page reloads or that other code is breaking this part of the code. Commented Jul 23, 2015 at 12:39

3 Answers 3

6

Is your HTML contained within the <form> tag? It is likely that your submit button is submitting the form and causing a page refresh before the JavaScript is executed.

If this is the case, try changing the input type to button to see the effect.

For example:

#my_id { display: none; }
<form> <input type="button" name="xxx" value=" Show Text! " onclick="document.getElementById('my_id').style.display = 'block' ;" /> <div id="my_id"> My text </div> </form>

Sign up to request clarification or add additional context in comments.

Comments

1

It should work.

<input type="submit" name="xxx" value="yyy" onclick="document.getElementById('my_id').style.display = 'block' ;"> <div id="my_id" style="display: none"> My text </div>

Are you sure not any other HTML is 'ruining' your code? I have tested this on Firefox, Chrome and IE (all latest versions tho)

Comments

0

Your submit button will submit the form it is placed in using the defined action and method. Any arguments / fileds in the form will be included as query parameters.

The reason you are not seeing your div appear, is because the click results in the page being reloaded. After the reload the div will be hidden again.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.