Linking HTML Checkbox to Javascript

Question

How could I link a checkbox from HTML into java script ? I have built the checkbox in HMTL like so : <label><b>Response Needed ?</b></label> <input id="Check" type="checkbox" >

When I hit the submit button I need the value to be T (true) or F (false) if its checked or not..

I usually use getElementById("") to link things into Javascirpt but cant get this to work!

EDIT: Here is my full Document so you can see how its works :

`

<!DOCTYPE HTML>
<html>
<head lang="en">
<meta charset="UTF-8"> 

 </head>

<body>

<form id="OTA">

    <label><b>IMEI:</b></label>
<input type="text" name="ID" id="IMEI" maxlength="15"> 

    <label><b>AT Command:</b></label>
    <input id="Command" type="text">

    <label><b>Response Needed ?</b></label>
    <input id="Check" type="checkbox" >


</form>
    <input type="submit" value="Submit" onclick="showInput();"><br />
    <p><span id='display'></span> </p> 

    <script language="JavaScript">
function showInput() {

    var message_entered = ">RSP=" + document.getElementById("Check").checked + ";ID=" +  document.getElementById("IMEI").value + ";" + document.getElementById("Command").value + "<";

    document.getElementById('display').innerHTML = message_entered;

}
    </script>

</body>

</html>

I need to change the values of the checkbox to T and F when checked or not. Cheers

repzero · Accepted Answer · 2015-12-26 15:44:14Z

1

here is some javascript

 <form id="OTA">
    
        <label><b>IMEI:</b></label>
    <input type="text" name="ID" id="IMEI" maxlength="15"> 
    
        <label><b>AT Command:</b></label>
        <input id="Command" type="text">
    
        <label><b>Response Needed ?</b></label>
        <input id="Check" type="checkbox" >
    
    
    </form>
        <input type="submit" value="Submit" onclick="showInput();"><br />
        <p><span id='display'></span> </p> 
    
        <script language="JavaScript">
    function showInput() {
         var test=null;
    var obj=document.getElementById("Check").checked;
    obj?test='t':test='f';
      var message_entered = ">RSP=" +test+  document.getElementById("IMEI").value + ";" + document.getElementById("Command").value + "<";
        document.getElementById('display').innerHTML = message_entered;
    
    }
        </script>

answered Dec 26, 2015 at 15:44

repzero

8,4203 gold badges21 silver badges42 bronze badges

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

2 Comments

repzero Over a year ago

Note...If you don't type anything,,you will see you "t" or "f" values showing alone

repzero Over a year ago

Welcome..Happy Holidays

repzero · Accepted Answer · 2015-12-26 15:14:55Z

1

Well... if you want to check whether a checkbox is checked or not (True or False), you can use document.getElementById("Check").checked

Example

if (document.getElementById("Check").checked) 
    console.log("checked");
else 
    console.log("not checked");

edited Dec 26, 2015 at 15:14

repzero

8,4203 gold badges21 silver badges42 bronze badges

answered Dec 26, 2015 at 14:28

An0nC0d3r

1,29316 silver badges35 bronze badges

7 Comments

jwollerton Over a year ago

Okay thanks. I need the outcome to be T or F.. how could I go about changing that ?

An0nC0d3r Over a year ago

What do you mean "the outcome"?

jwollerton Over a year ago

as in I need to change True and False to T and F

An0nC0d3r Over a year ago

Yes but in what way? How are you using the "T" and "F"? Given the above example, you know whether the checkbox is checked or not, so you can at that point set anything you like to "T" or "F" and return it. I'm not sure I understand.

jwollerton Over a year ago

okay, usually when the checkbox is checked and submit is hit it would display True.. instead I need it to display T or F if its not checked

|

Vinay Prajapati · Accepted Answer · 2015-12-26 14:38:15Z

0

On your submit button call some javascript method like below:

<form action="someAction" method="post"  onSubmit="javascript:validate()">
<input type="hidden" name="checkValue" id="checkValue" value='F'/> <!--Default value is F say -->
<submit></submit>
</form>

Now, below is validate function:

<script>
function validate(){
  if (document.getElementById("Check").checked){ 
     document.getElementById("checkValue").value = 'T'
  }else{ 
     document.getElementById("checkValue").value = 'F'
  }
}
</script>

There is just one disadvantage that you need to have checkbox with name different than original name you wanted as that original name would go to hidden field.

Hope it helps!!

answered Dec 26, 2015 at 14:38

Vinay Prajapati

7,58012 gold badges51 silver badges88 bronze badges

Collectives™ on Stack Overflow

Linking HTML Checkbox to Javascript

3 Answers 3

2 Comments

7 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related