1

How can I create in HTML a clickable label with textbox (clicking on label or texbox turns the checkbox on)?

Dávid Kovács
  • 11
  • 2

3 Answers3

0

Please try this

<label class="checklabel">Check Now
  <input type="checkbox">
</label>
Rayees AC
  • 4,426
  • 3
  • 8
  • 31
  • Yeah, that's working. But I have a checkbox list, with multiple choices, and I have a last checkbox, name "Other". After "Other" I have a textbox, and I want a textbox which I click on it turns on the checkbox. – Dávid Kovács Aug 18 '20 at 17:56
0

If I am understanding you correctly, you can do something like this:

<!DOCTYPE html>
<html>
<body>

<h1>Check Boxes - Example</h1>

<form action="/myPage.php">
  <input type="checkbox" id="chkboxQuestion" name="chkboxQuestion" value="Bike">
  <label for="chkboxQuestion">Do you like this checkbox?</label><br>
</form>

</body>
</html>

Hopefully that helps you out!

LuvCode
  • 29
  • 6
  • This is my code: If I'm clicking on the "Other" it will check the box in front of it. But if I'm clicking on the textbox, nothing happens, and the textbox or clicking "Other" needs to turn checbox on when I'm clicking one of them. – Dávid Kovács Aug 18 '20 at 18:01
0

If i understand correct, you wanna check if click the input, and you have to implement js on this one

const other = document.getElementById("other");
const checkBox = document.getElementById("otherCheckbox")
other.addEventListener("click", () =>{
  if(checkBox.checked){
    checkBox.checked = false;
  }else{
    checkBox.checked = true;
  }
})
<input type="checkbox" name="color" id="otherCheckbox">
<label for="other">Other</label><input type="text" id="other">

and i changed the html adding the id of "otherCheckbox" to the checkbox input and thats it, every time you click the input its gonna toggle the check

Samuel Calderón
  • 41
  • 2