0 
0 In HTML it is possible to define an accesskey for a control. For example if you want to have a button which the user can click using the hot-key alt-p., you can do this with the following HTML
<input type="button" value="push me" accesskey="p" onclick="alert('clicked')"/>
It is not possible to underline the first letter with the value attribute to indicate the hot-key. You could use the < input type=image> . But then you would have to use different images and javascript to mimick button behavior when clicked.
Again CSS comes to the rescue.
<html>
<head>
<style>
.pbutton {
background:url(push.gif);
width:200px;
height:40px;
}
</style>
</head>
<body>
<input type="button" class="pbutton" accesskey="p" onclick="alert('clicked')"/>
<body>
</html>
I created an image with a text with an underlined first letter the same dimensions as mentioned in the style (40px by 200px). And voila , Bob’s your uncle..
IE XP bug
I innitially used background-image in the style sheet declaration. But apparently there is a freaky IE bug related to XP themes .. (click here)
One of the things I picked up from that site is that you can disable the themes on a page using a meta tag
<meta http-equiv="msthemecompatible" content="no">
I18N in Struts
As with all images, I18N of these buttons is a bit harder in dynamically generated pages …
In a struts application you would probably get away with something like
.... background:url(<bean :message key="buttons.pushme"/>); ....
In the resource bundles you would add an entry like
buttons.pushme=push_fr.gif
for the french resourcebundle
or
buttons.pushme=push_en.gif
for the english resourcebundle
and then create the corresponding images with the appropriate text.
One drawback is that you would have to include the style in every JSP instead of in an external css file. But a JSP include would solve that without much effort
Related posts:
Example of XSL-transforming in ADF applications – downloading Excel (CSV) files from ADF Web Applications Having the end-user hide and display columns in a JSF Table Component Javapolis 2006 – Building Sexy Web apps with Flex Unit testing Javascripts in Java 6 – Getting started with the javax.script api Apache My Faces Trinidad: triggering Partial Page Refresh ("AJAX") from non Trinidad components
What do you think about collapsing the button [input type=â€button†id=â€pushButton†accesskey=â€p†style=â€visibility:collapse†/] and replacing it with a label assigned to it: [label for=”pushButton”][u]P[/u]ush me![/label]
http://technology.amis.nl/blog/index.php?p=145
Good points! I hadn’t thought of the accesskey not being present on the text on the button in some languages !
oops. html allowed.
anyway you’d be better off to write a custom tag do do this button for you.
you could define the accesskey, and if the accesskey was not found in the word to be displayed, display the accesskey afterwards in brackets:
eg:
someForeignWord [p]
having to create an image for every button is a bit of a bummer.
Maybe you could try something like:
push me
use css to style is into a square button..