javascript onclick not working in a form

Question

i am trying to change text of a span using onclick of javascript but its not working . Its very simple stuff but i am not sure why its not working

<div class="subscribe_block">
   <h3><span>Stay Connected</span></h3>
   <form method="post" action="" name="subscribeForm">
    <span id="message"></span>
    <p><input type="text" id="name" placeholder="Your Name" /></p>
    <p><input type="text" id="email" placeholder="Email Id" /></p>
    <p><input type="submit" value="subscribe" onClick='document.getElementById("message").value = "Thank you for subscribing";return false;' /></p>
   </form>
  </div>

js code is in onclick

Abhishek Kumar
– Abhishek Kumar

2014-03-20 11:23:36 +00:00
Commented Mar 20, 2014 at 11:23 — Abhishek Kumar
– Abhishek Kumar, Commented Mar 20, 2014 at 11:23
i tried that as well but it dint work

Abhishek Kumar
– Abhishek Kumar

2014-03-20 11:24:22 +00:00
Commented Mar 20, 2014 at 11:24 — Abhishek Kumar
– Abhishek Kumar, Commented Mar 20, 2014 at 11:24

halkujabra · Accepted Answer · 2014-03-20 11:25:50Z

1

    <div class="subscribe_block">
   <h3><span>Stay Connected</span></h3>
   <form method="post" action="" name="subscribeForm">
    <span id="message"></span>
    <p><input type="text" id="name" placeholder="Your Name" /></p>
    <p><input type="text" id="email" placeholder="Email Id" /></p>
    <p><input type="submit" value="subscribe" onClick='document.getElementById("message").innerHTML = "Thank you for subscribing";return false;' /></p>
   </form>
  </div>

Use 'innerHTML' instead of 'value'.

answered Mar 20, 2014 at 11:25

halkujabra

2,9524 gold badges28 silver badges38 bronze badges

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

Comments

Deepika · Accepted Answer · 2014-03-20 11:32:40Z

1

On the onclick function, try changing,

'document.getElementById("message").value = "Thank you for subscribing";return false;'

to

 'document.getElementById("message").innerHTML = "Thank you for subscribing";return false;'

answered Mar 20, 2014 at 11:32

Deepika

3412 gold badges7 silver badges20 bronze badges

Comments

Aftab Ahmed · Accepted Answer · 2014-03-20 11:33:56Z

0

using InnerHtml will set your Span text but as it will post back so you will be unable to see anything. Remove form tag then you will be able to see it.

<div class="subscribe_block">

Stay Connected

<span id="message"></span>
<p><input type="text" id="name" placeholder="Your Name" /></p>
<p><input type="text" id="email" placeholder="Email Id" /></p>
<p><input type="submit" value="subscribe"  onClick='document.getElementById("message").innerHTML= "Thank you for subscribing";return false;'  /></p>

answered Mar 20, 2014 at 11:33

Aftab Ahmed

1,73711 silver badges15 bronze badges

Comments

TheMohanAhuja · Accepted Answer · 2014-03-25 12:26:06Z

0

Just change value to innerHTML as

<div class="subscribe_block">
    <h3><span>Stay Connected</span></h3>
    <form method="post" action="" name="subscribeForm">
        <span id="message"></span>
        <p><input type="text" id="name" placeholder="Your Name" /></p>
        <p><input type="text" id="email" placeholder="Email Id" /></p>
        <p><input type="submit" value="subscribe" onClick='document.getElementById("message").innerHTML = "Thank you for subscribing";return false;' /></p>
    </form>
</div>

edited Mar 25, 2014 at 12:26

answered Mar 20, 2014 at 11:26

TheMohanAhuja

1,8752 gold badges19 silver badges30 bronze badges

Collectives™ on Stack Overflow

javascript onclick not working in a form

4 Answers 4

Comments

Comments

Stay Connected

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Stay Connected

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related