1

I actually found a js code here but it seems not working properly for me. Could somebody check the code please? Maybe I made a few mistakes. I am looking for a possibility to add a checkbox before entering a new page. Thank you so much PS I just started with it so please be kind ^^

   <script>
        function agree(){
            b = document.getElementById('btn');
            c = document.getElementById('checkbox');
             if(c.checked == true){

             input type=\"button\" name=\"Button\" value=\"Submit\" onClick =          \"document.location.href='page2.htm' \";

             }else{

             b.innerHTML = "<input type=\"button\" name=\"Button\" value=\"Submit\" disabled=\"disabled\"/>"

             }
        }
    </script>

    </head>
    <body>
    <table width="800" height="50" border="0">
    <tr>
    <td width="500" height="42"> <input type="checkbox" name="checkbox"     value="checkbox"  onclick="agree()"/>
      <label> I agree to the Terms and Conditions. <br>
    </label></td>
    <td width="800" align="left">

    <div id="btn">
     <input type="button" name="Button" value="Submit"  disabled="disabled"/>
    </div>

    </td>
     </tr>
   </table>
  • 2
    You have no elements with either the ID of button nor checkbox, therefore `document.getElementById` will fail. – j08691 Sep 10 '15 at 14:11
  • 1
    Define "not working". Does it crash? Does it show the wrong thing? Does a JS debugger give you any details? – Silvio Mayolo Sep 10 '15 at 14:11

1 Answers1

0

Direct & full code here

I changed your script to simplify it a bit. Let's see how I did that:

function agree() {
    //Go and find the button.
    b = document.getElementById('btn');
    //Go and find the checkbox
    c = document.getElementById('checkbox');

    //Set the buttons disabled state to the inverse of the checkbox:
    //Checkbox == true ==> Button = enabled.
    //Checkbox == false ==> Button = disabled.
    b.disabled = !c.checked;
}

Now, one last important part: set the id's to the right elements:

<table width="800" height="50" border="0">
    <tr>
        <td width="500" height="42"> 
            <input type="checkbox" name="checkbox" id="checkbox" value="checkbox"  onClick="agree();"/>
            <label> I agree to the Terms and Conditions. <br></label>
        </td>
        <td width="800" align="left">
            <div>
                <input id="btn" type="button" name="Button" value="Submit"  disabled="disabled"/>
            </div>
        </td>
    </tr>
</table>

The button itself has the id btn, where as the checkbox has the id checkbox.

Jordumus
  • 2,763
  • 2
  • 21
  • 38
  • Thank you so much. Seems to work but where can I add the target URL behind the button? "Click submit and you'll be forwarded to page xyz?" – Titos Tarantula Sep 11 '15 at 06:56
  • @TitosTarantula Have a look [here](http://stackoverflow.com/questions/3682805/javascript-load-a-page-on-button-click) for that problem. :) - Also: if you found my answer helpful, please give it an upvote and mark it as "answer". – Jordumus Sep 11 '15 at 07:14
  • Great one more point :D Is it also possible to have the button first grey and when the checkbox is actived turn into another color? Where can I give you an upvote and mark it? – Titos Tarantula Sep 11 '15 at 08:59
  • Next to my answer there is an up- and down arrow, you can click the "up" arrow, and then the "V" below the arrows to mark it as an answer. - For your background-color question, [have a look here](http://stackoverflow.com/questions/3319/css-background-color-in-javascript) – Jordumus Sep 11 '15 at 09:03