March 17th, 2007

How Can I Force a Specified Letter Case in an HTA?

Hey, Scripting Guy! Question

Hey, Scripting Guy! In our company we often use HTAs as data entry forms. For some of our applications case-sensitivity is important; for example, our product numbers are case-sensitive. I know I can write a script to change letter case, but I was wondering if there was a way to force letter case (either all uppercase or all lowercase) at the time people actually do their data entry.

— SK

SpacerHey, Scripting Guy! AnswerScript Center

Hey, SK. You know, the great thing about this column – oh, wait; that’s a different column. In fact, now that we think about it, we can’t come up with any great things about this column. Be that as it may, however, the interesting thing about this column is that – well, you’re right: that really isn’t all that interesting, is it? Hmmm ….

OK, let’s try this again. You know, the not-so-great and not-all-that-interesting thing about this column (better?) is that we Scripting Guys probably learn more from writing the column than anyone does from reading it. Based on the emails we receive we know that some of you (obviously those who don’t know us very well) assume that the Scripting Guys can answer any scripting question at all, and right off the top of our heads. And you know, come to think of it, maybe we can answer any question that people ask:

“Hey, Scripting Guy! How can I force letter case when people do data entry?”

“Beats us.”

Technically, “Beats us” is an answer. It’s just not a very good answer.

But don’t fret, SK. Following our usual pattern, we did a bit of research and managed to come up with a better answer for you:

<body>
    Box 1 <input type=”text” name=”Box1″ size=”30″ style=”text-Transform:uppercase”><P>
</body>

As you can see, this is perhaps the simplest HTA ever created: there’s nothing to it except for a single text box. But take a look at the HTML tag for that text box:

<input type=”text” name=”Box1″ size=”30″ style=”text-Transform:uppercase”>

What we’ve done here is apply a style to the box; in particular, we’ve assigned a value to the text-Transform attribute: style=”text-Transform:uppercase”. Is there a method behind that madness? You bet there is: setting text-Transform to uppercase automatically converts any text typed into that box to its uppercase equivalent. Best of all, you can do that without having to write any script code.

And, now that you mention it, yes, there are other values you can assign to text-Transform. For one, you can assign the value lowercase to convert all the letters typed into the box to their lowercase equivalent. For another, you can assign the value capitalize to make the first letter in each word uppercase (subsequent letters in the word are not converted; they show up exactly as you type them). Here’s a sample HTA that uses each of these text-Transform values. Take a close look at the letter casing in each text box; all the letters in all three boxes were typed using lowercase. But, as you can see, they don’t all show up as lowercase:

HTA


And here’s the HTML tagging we used to create this sample form:

<body>
    Box 1 <input type=”text” name=”Box1″ size=”30″ style=”text-transform:uppercase”><P>
    Box 2 <input type=”text” name=”Box2″ size=”30″ style=”text-transform:lowercase”><P>
    Box 3 <input type=”text” name=”Box3″ size=”30″ style=”text-transform:capitalize”><P>
</body>

Pretty cool, huh?

We might add that although SK didn’t want to use a script to modify letter case you (or even you, the guy in the green) can use a script if you so choose. Here’s a modified HTA that features a button that toggles between lowercase and uppercase:

<Script Language=”VBScript”>
    Sub CaseChanger
        If Box1.Style.textTransform=”lowercase” Then
            Box1.Style.textTransform=”uppercase”
        Else
            Box1.Style.textTransform=”lowercase”
        End If
    End Sub
</Script>

<body> Box 1 <input type=”text” name=”Box1″ size=”30″><P> <input type=”button” Value=”Run” type=”button” onClick=”CaseChanger” style=”text-Transform:lowercase”> </body>

The cool thing here is that it not only toggles the style assigned to the text box, but it dynamically changes the letter case for any text currently in the text box.

We hope that helps, SK. And we hope that you learned something today, because – as usual – the Scripting Guys learned something: we learned that it would be much better if we did our research ahead of time so that we could answer questions off the top of our heads. And so, by golly, we’re going to do that: we’re going to do our homework and learn everything there is to know about scripting.

But not today; today the Scripting Son has a baseball game and we need to leave early. But tomorrow, tomorrow we start.

Well, actually, the NCAA men’s basketball tournament is tomorrow. But next week, next week for sure.

Author

0 comments

Discussion are closed.