ansaurus

Question

IE onClick will not check a checkbox unless you click the image in the label?

Answer 1

+2 A:

One of the nice things that browsers do, is triggering click events from <label> elements for us.

So my recommendation is to attach the click handler to the checkbox itself. This way your function becomes MUCH simpler.

Also, it's illegal to put block-level elements inside of line-level elements, so I've changed your <div> to a <span> and used CSS to make it render as a block-level element.

<html>
<head>

<script language="javascript" type="text/javascript">
  function changecolor( cbox, divId, firstcolor, secondcolor )
  {
    document.getElementById( divId ).style.background = cbox.checked ? firstcolor : secondcolor;
  }
</script>

<style type="text/css">
  span.listing {
    display: block;
  }
</style>

</head>
<body>

<input type="checkbox" id="idbox" name="cboxwithlabel" value="Another check box" onClick="changecolor(this, 'Test33', '#09C', '#0F0');">
<label for="idbox">
  <span class="listing" id="Test33">
    Another checkbox<img src="images/checkmark.png" height="80" width="80"  onclick="this.parentNode.click()" />
  </span>
</label>

</body>
</html>

Peter Bailey 2009-08-27 18:06:26

That works, except now when you click the image in IE it it doesn't do the onClick function, it has to be the Span that you click... so ended up with the exact opposite problem. Both Firefox and Chrome work perfect with this solution.

John 2009-08-27 18:28:47

Ok reaidng up, the image problem in this case is just an IE issue. I'll be able to deal with that. Thanks.

John 2009-08-27 18:34:22

I had accidentally left some debug code in there. I updated it so clicking the image works in IE now.

Peter Bailey 2009-08-27 18:46:51

Answer 2

A:

Some comments have suggested it, but as a part of troubleshooting I would put an alert before setting the checkbox.

alert('test');
chkboxid.checked = true;

I think you will see that the alert is never executed and the code checking the browser is behaving differently in IE and FF.

If not, you will at least be on your way to finding out why this isn't working by moving the alert around.

Mayo 2009-08-27 18:10:01

ansaurus

tags:

views:

answers:

IE onClick will not check a checkbox unless you click the image in the label?

related questions