Better to use widgets. I am using HTMLPanel to wrap my divs. My example has clickable image with text which is ready for internationalization. Actually 3 images where 2 are for some common background and the third gives item specific image. You also better make cursor to be a pointer when mouse goes over so user understands that it is clickable area(see .center:hover). I implemented on GWT 2.2 using UIBinder In UIBinder <ui:image field="glass_ball" src="../../resources/glass_ball.png"/> <ui:image field="shine" src="../../resources/shine.png"/> <ui:image field="isite_exit" src="../../resources/isite_exit.png"/> <ui:style src = "../../resources/defines.css" type="com.idirect.webnms.isite.client.common.top.TopBarView.UIStyle"> .center { width:60px; text-align:center; font-size: 12px; font-family: arial; } .center:hover { text-decoration: underline; cursor: pointer; cursor: hand; color: orange; } @sprite .glassBackground { gwt-image: "glass_ball"; margin-top: 8px; line-height: 8em; } @sprite .shine { gwt-image: "shine"; } @sprite .backgroundExit { gwt-image: "isite_exit"; } </ui:style> <g:HTMLPanel ui:field='cmd_exit' addStyleNames='{style.center}'> <div> <div class='{style.glassBackground}'> <div class = '{style.shine}'> <div class='{style.backgroundExit}'> </div> </div> </div> <div> <ui:msg description='Top bar, command exit'>Log out</ui:msg> </div> </div> </g:HTMLPanel>
In my client Java code I have click handler registration and remove logic. In general you should remove handler when Window closing @UiField HTMLPanel cmd_exit; private HandlerRegistration regCmdExitClick; if(regCmdExitClick == null) { regCmdExitClick = cmd_exit.addDomHandler(new ClickHandler() { public void onClick(final ClickEvent event) { //my logout logic if(regCmdExitClick != null) { regCmdExitClick.removeHandler(); regCmdExitClick = null; } } }, ClickEvent.getType()); } Hope it helps -Sergey -----Original Message----- From: google-web-toolkit@googlegroups.com [mailto:google-web-toolkit@googlegroups.com] On Behalf Of varakumar pjd Sent: Tuesday, March 29, 2011 2:30 AM To: Google Web Toolkit Subject: How to add ClickHandler for Div Element? Hi, I created a div element and appended it to a text box as a child. It is working fine. Now I want to add click handler for that div element. Can you please suggest me for this problem. Thanks, Vara Kumar PJD -- You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group. To post to this group, send email to google-web-toolkit@googlegroups.com. To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en. </PRE><BR><span style='font-size:8.0pt;font-family:"Arial","sans-serif";color:#003366'> _____________________________________________________<BR> This electronic message and any files transmitted with it contains<BR> information from iDirect, which may be privileged, proprietary<BR> and/or confidential. It is intended solely for the use of the individual<BR> or entity to whom they are addressed. If you are not the original<BR> recipient or the person responsible for delivering the email to the<BR> intended recipient, be advised that you have received this email<BR> in error, and that any use, dissemination, forwarding, printing, or<BR> copying of this email is strictly prohibited. If you received this email<BR> in error, please delete it and immediately notify the sender.<BR> _____________________________________________________ </SPAN><PRE> -- You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group. To post to this group, send email to google-web-toolkit@googlegroups.com. To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.