Aaron Brunt
Aaron Brunt

Reputation: 27

I cannot link my Button output to my Javascript function

This is a function that is part of a larger website I am designing. In a general sense I am trying to perform a Javascript function that will un-disable the disabled input HTML boxes from the click of a 'yes" button.

After clicking the "yes" button it seems it is not working.

Here is my code.

<html>
    <head>
        <script language="javascript" type="text/javascript">
          function myFunction() {
          document.getElementById("first").disabled = false;
        }
</script>


 </head>
 <body>
      Perform Operation?: <br>
                <button onClick=myFunction()>Yes</button
                <div>
                    First Number: <input type="number" id="firstnumber" value=0 disabled><br>
                    Second Number: <input type="number" id="secondnumber" value=0 disabled><br>
                </div>
 </body>

Upvotes: 1

Views: 62

Answers (2)

Prashant Shirke
Prashant Shirke

Reputation: 1423

Your code is ok. Just you are using either wrong id or you have forgot to add the used id to your input. :-)

So either remove extracharges from below code and add firstnumber or secondnumber as per requirement or add input with extracharges as id.

function myFunction() { document.getElementById("extracharges").disabled = false; }

As pointed out in other answers and comments about case sensivity of JavaScript is right, but when you use event handlers as attribute (in html) then most of the browser understands it irrespective of its case.

Check this SO answer for more details!

Upvotes: 1

Super User
Super User

Reputation: 9642

You have written wrong selector here, check updated snippet below:

 function myFunction() {
  document.getElementById("firstnumber").disabled = false;
   document.getElementById("secondnumber").disabled = false;
}
Perform Operation?: <br>
<button onClick=myFunction()>Yes</button
<div>
    First Number: <input type="number" id="firstnumber" value=0 disabled><br>
    Second Number: <input type="number" id="secondnumber" value=0 disabled><br>
</div>

Upvotes: 3

Related Questions