CODEWITHSUNDEEP
javascript
Abhishek Kumar
Abhishek Kumar

Reputation: 2276

javascript onclick not working in a form

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>

Upvotes: 1

Views: 145

Answers (4)

TheMohanAhuja
TheMohanAhuja

Reputation: 1875

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>

Upvotes: 0

Aftab Ahmed
Aftab Ahmed

Reputation: 1737

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>

Upvotes: 0

Deepika
Deepika

Reputation: 331

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;'

Upvotes: 1

halkujabra
halkujabra

Reputation: 2942

    <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'.

Upvotes: 1

Related Questions