Hey, Scripting Guy! How can I add a hotkey to a button in my HTA?
Hey, TM. As usual, the Monday column is being written on Friday; however, the Scripting Guy who writes this column is having far more trouble getting things done than he usually does. That’s because today is day 2 of the NCAA basketball tournament (“March Madness”) and he’s trying both to write this column and listen to – at the moment – San Diego vs. Connecticut. That’s not going all that well, mainly because he finds it hard to just listen to the game; the game is being telecast over the Internet, and every time something happens the Scripting Guy who writes this column can’t help but switch over the browser window and watch the replay. He then returns to writing today’s column, only to remember that its time to check the South Alabama vs. Butler score (Butler 56, South Alabama 38).
And yes, we agree: you would think Microsoft would give everyone days 1 and 2 of the tournament off, wouldn’t you? Unfortunately, Microsoft seems oblivious to the NCAA basketball tournament. For example, when the Cricket World Cup was played, a gigantic TV screen was set up in the cafeteria and all the games were shown there. The same thing occurred during soccer’s World Cup. But for the NCAA basketball tournament, the absolute greatest sporting event ever created? Nothing. Nada. Zip. How many people at Microsoft even care that Stephan Curry scored 40 points as Davidson rallied to beat Gonzaga 82-76? Other than the Scripting Guy who writes this column: None. Nada. Zip.
Fortunately there is March Madness on Demand, which – despite a somewhat-choppy picture – does let the Scripting Guy who writes this column keep tabs on everything that’s going on. Not that TV over the Internet is all that great, mind you; for example, if you don’t go in periodically and either minimize or maximize your browser window you’ll be kicked out of the broadcast “viewing room.” (Why? Because if there’s no such window activity it’s assumed that you aren’t watching any more. Why? Because apparently the network believes that anyone who watches a basketball game over the Internet spends most of their time minimizing and maximizing their browser window rather than actually watching the game.) Nevertheless, it works; how else would we know that Western Kentucky sank a three-pointer at the buzzer to beat Drake in overtime?
At the moment, however, there’s a break in the action: Texas, Georgetown, and Butler all have comfortable leads, and San Diego and Connecticut are at half time. (With San Diego leading by 5. What a … shame … if Connecticut loses, eh?). That gives us just enough time to show you how to add a hotkey to an HTA button:
<Script Language="VBScript"> Sub ButtonA Msgbox "Button A was clicked." End Sub Sub ButtonB Msgbox "Button B was clicked." End Sub Sub ButtonC Msgbox "Button C was clicked." End Sub </Script> <body> <button onClick="ButtonA" accessKey="a"> Button <U>A</U> </button> <button onClick="ButtonB" accessKey="b"> Button <U>B</U> </button> <button onClick="ButtonC" accessKey="c"> Button <U>C</U> </button> </body>
The secret to adding a hotkey to an HTA button is this: use the <button> tag rather than the <input> tag. Why? We’ll explain why in just a moment. Before we do, we should note that you might think that the best way to add a hotkey to a button is to use an HTML tag similar to this:
<input type="button" value="Button A" onClick="ButtonA" accessKey="a">
That actually works just fine; add that tag to your HTA, and pressing Alt+a on the keyboard is exactly the same as clicking Button A itself. The only problem with using the <input> tag is that you can’t do anything to indicate which key is the hotkey for a given button. Instead, your HTA will look like this, and the user will have no idea that pressing Alt+a is the same thing as clicking Button A:
Needless to say, there isn’t much point in adding a hotkey if no one knows that this hotkey is available to them.
By contrast, using the <button> tag enables us to create a more typical user interface, one in which the hotkey is clearly labeled:
So how do we actually implement the <button> tag? Well, let’s take a look at the code for creating Button A:
<button onClick="ButtonA" accessKey="a"> Button <U>A</U> </button>
As you can see, we simply add the <button> tag along with two parameters:
onClick="ButtonA". This is simply the name of the subroutine we want to run each time the button is clicked or each time we press the appropriate hotkey.
accessKey="a". This is the hotkey associated with the button. Note that the Alt key is assumed; we only have to specify the “other” key, in this case the other key being a. By the way, this is the a key and not the actual letter a; there’s no difference between an uppercase A (e.g., the key being pressed while Caps Lock is on) or a lowercase a (e.g., the key being pressed while Caps Lock is off).
In addition to adding these two parameters notice how we format the button label (that is, the text that appears on the button):
Unlike the <input> tag, the <button> tag allows you to use HTML tagging as part of the label text. All we’ve done here is use the underline tag (<U></U>) to put an underline under the A in Button A; that’s the standard way to indicate a hotkey in Windows. If you march to the beat of a different drummer, however, you can use some other method to indicate the hotkey. For example, this tagging puts the letter A in boldface:
As for the subroutines that get called when a button is clicked or a hotkey pressed, well, for this simple script the subroutines are equally simple: they pop up a message box that indicates which button was clicked. For example, here’s the code for the subroutine ButtonA:
Sub ButtonA Msgbox "Button A was clicked." End Sub
Most likely you’d have your HTA do something a little fancier, and maybe even a little more practical. But that’s entirely up to you.
Halftime is over, which means it’s time to go back to … work …. For those of you who keep track of these things (and we know that some of you do keep track of these things) the Scripting Guy who writes this column is off to a slow start in defending his championship when it comes to picking the winners of each and every game in the tournament; as of this morning, the Scripting Son, the Scripting Brother, and the Scripting Editor (!) were tied for first place, with the Scripting Guy who writes this column trailing by 2 points. But that’s OK: it’s still early, and the fun doesn’t really begin until round 3. The Scripting Guy who writes this column isn’t worried.
Although he won’t be happy if he somehow manages to finish behind the Scripting Editor, who selected her winners based on which team has the prettiest uniforms.
Note. OK, that’s not really how the Scripting Editor selected her winners; she actually knows a little something about college basketball. However, based on his performance in the tournament so far the Scripting Guy who writes this column is beginning to wonder if that’s how he should have picked his winners.
Editor’s Note: San Diego won in overtime.