Click checkbox's label - javascript onclick gets called twice

22 May 2005 9:29 AM

dotnw

This is intriguing - I've copied over my old fully working ASP.NET
project from a Win 2000 Pro box to an XP Pro box. Everything seems to
work fine, except I've noticed one difference. I have a server side
checkbox with a javascript onclick event attribute attached to it.
When you click the checkbox's *label*, on the new XP box, the
javascript onclick event gets called twice, with undesired
consequences. This odd side effect does not occur if you click the
checkbox's box itself. On the Win 2000 box, this side effect does not
occur at all.

Any thoughts please? Thanks, regards, dnw.

22 May 2005 11:00 AM

sam

I think you may be posting *2* requests to the server by double
clicking or something. I had this problem once by using an input
type=image with a dopostback click event handler.

Check the web server logs for double get requests very close together
in time. You can see where these are by going into IIS and looking for
the log file paths property or whatever.

This saved me a lot of time.

-Sam Robertson

22 May 2005 11:45 AM

dotnw

In the iis log file, there's only one GET for my test (click)
operation.

Thanks for the idea though.

Any other thoughts please? Thanks, regards, dnw.

22 May 2005 12:10 PM

dotnw

PS: I've just set up a completely new test project with 2 lines of code
to do this, and the javascript function still gets called twice.

I think this is only happening on my new development machine locally,
because before I changed operating systems, I uploaded my old solution
to the internet, and it works correctly using the new XP operating
system.

23 May 2005 9:53 PM

sam

Now my guess is that the onclick in the label html is being executed
twice, maybe because of a reinterpretation of event bubbling in
javascript. Can you post the complete html for the checkbox and label?
Is it the standard asp.net control?

24 May 2005 7:02 AM

dotnw

Sam, I am using a standard asp.net server side checkbox.

Server side code (there's only 1 line of code)

    CheckBox1.Attributes.Add("onclick", "myfunc()")

HTML code (when in debug mode)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
        <title>WebForm1</title>
        <meta content="Microsoft Visual Studio.NET 7.0" name="GENERATOR">
        <meta content="Visual Basic 7.0" name="CODE_LANGUAGE">
        <meta content="JavaScript" name="vs_defaultClientScript">
        <meta content="http://schemas.microsoft.com/intellisense/ie5"
name="vs_targetSchema">
    </HEAD>
    <script language="javascript">
        function myfunc()
        {
            debugger;

            //This function gets called twice when you click the label portion
of the checkbox.
        }
    </script>
    <body MS_POSITIONING="GridLayout">
        <form name="Form1" method="post" action="WebForm1.aspx" id="Form1">
<input type="hidden" name="__VIEWSTATE"
value="dDwtMTQzNTI4NjQ4NDt0PDtsPGk8MT47PjtsPHQ8O2w8aTwxPjs+O2w8dDxwPDtwPGw8b25jbGljazs+O2w8bXlmdW5jKCk7Pj4+Ozs+Oz4+Oz4+O2w8Q2hlY2tCb3gxOz4+OcJL1892mws5/wDzHiAIKucAYbU="
/>

            <span onclick="myfunc()" style="Z-INDEX: 101; LEFT: 271px; POSITION:
absolute; TOP: 205px"><input id="CheckBox1" type="checkbox"
name="CheckBox1" /><label for="CheckBox1">Click me here</label></span>
        </form>
    </body>
</HTML>

The really interesting thing is that if I upload this test project to a
server on the internet, it works fine - the javascript function only
gets called once.

Thank you, regards -dnw.