Double-Click HTML Element

  • Article

 

Double-clicking a programmable HTML element in Visual Web Developer causes the following actions:

  • A client-side event handler function is created in the script block at the top of your .aspx page, even if you are using the ASP.NET code-behind page model.

  • A language attribute is created in the HTML element and set to "javascript".

  • An onclick attribute is created in the HTML element and set to the name of the event handler function name.

Examples of programmable elements that can be double-clicked are the Input, Textarea, and Select HTML elements. Add code to the event handler function that will run on the client.

Note

Double-clicking an HTML element that is not programmable has no effect in Visual Web Developer.

If you want to create a server-based event handler for the element, you have two options:

  • You can run the HTML element as a server control.

  • You can use one of the equivalent ASP.NET server controls instead.

To run the HTML element as a server control

  1. If you have already double-clicked the HTML element, then restore the element to its previous state. To do this, switch to Source view, remove the language and onclick attributes of the element, and delete the onclick function that is defined in the script block.

  2. Switch to Design view.

  3. Right-click the HTML element and click Run As Server Control.

  4. Save your file and double-click the HTML element again.

    An event handler method is automatically added to the script block or to the code-behind page if you are using the ASP.NET code-behind model. A runat attribute is added to the element and set to "server". Also, an event attribute is added and set to the name of the event handler method that was automatically generated.

To convert the HTML element to an equivalent ASP.NET server control

  1. Switch to Design view.

  2. In the Toolbox, select the server control that is the closest equivalent match to your HTML element. For example, an Input HTML element of type checkbox is roughly equivalent to the CheckBox server control in the Standard tab of the Toolbox. For a list of server controls, see Standard Toolbox Controls.

  3. Drag your control from the Toolbox onto the page.

  4. Save your file and double-click the server control.

    An event-handler method is automatically added to the script block or to the code-behind page if you are using the ASP.NET code-behind model. An event attribute is added and set to the name of the event-handler method that was automatically generated.

  5. Transfer any strings from your HTML element to the new server control and then remove your HTML element. If you had already double-clicked the HTML element, transfer the code from the client-side event-handler function to the new event-handler method. Test your control to see if any changes need to be made.

Tasks

NIB: How to: Create Scripts and Edit Event Handlers.

See Also

ASP.NET Web Server Controls Overview
Adding HTML Server Controls to an ASP.NET Web Page
Standard Toolbox Controls
ASP.NET Web Server Controls Overview