How Can I Add a Right-to-Left Text Box to a Web Page?

ScriptingGuy1

June 12th, 20060 0

Hey, Scripting Guy! How can I add a right-to-left text box to a Web page?

— B

Hey, B. To begin with, we should note that we aren’t entirely sure that we know what we’re talking about here. (Good point: that’s a disclaimer that could be added to all of our columns, couldn’t it?) We are aware of languages – Arabic languages and Hebrew, for example – that are read from right-to-left; however, we aren’t exactly proficient in any of those languages. (And, as our editor continually points out, we aren’t all that good when it comes to English, either.)

Nevertheless, we think (hope) that this is what you had in mind:

<SCRIPT LANGUAGE=”VBScript”>
    Sub TestSub
        Msgbox ScriptArea.Value       
    End Sub
</SCRIPT>
<body>
    <textarea name=”ScriptArea” rows=5 cols=70 dir=”rtl”></textarea><p>
    <input id=runbutton  type=”button” value=”Run Script” onClick=”TestSub”>
</body>

Believe it or not, this is even easier than it looks; after all, much of the code is there in order to: 1) create a button (which you might not need in your Web page or HTA), and 2) to add a subroutine that runs when the button is clicked. As it turns out, the part you really care about consists of nothing more than a single HTML tag:

<textarea name=”ScriptArea” rows=5 cols=70 dir=”rtl”></textarea>

What we’re doing here is adding a multi-line text box control (or a <textarea>) named ScriptArea; we’re also sizing the text box so it displays 5 rows, with 70 columns per row. Nothing too fancy there. But take a look at this additional property assignment: dir=”rtl”. That’s the cool part. The dir property determines the reading order of a text box. If dir is set to rtl then the reading order is right-to-left, which is what you were looking for. If dir is set to ltr (or if the dir property is omitted altogether) then the reading order is set to left-to-right. Believe it or not, that’s all we have to do to create a right-to-left text box.

Here’s what the text box looks like when added to an HTA (HTML Application):

Not bad, if we do say so ourselves. (Or, if you’re reading from right-to-left: dab toN.) Type the information into the text box and click the Run Script button; with any luck, a message box will appear echoing back the contents of the text box.

Now, we know what you’re thinking: yes, the text is right-justified and, yes, the periods are in an unusual place. However, the text doesn’t actually read right-to-left. True: that’s because we’re typing in English, which uses the so-called Latin alphabet. Text will not be displayed right-to-left when using a Latin alphabet. But things will be very different if you type using Arabic, Farsi, Hebrew, or any other language that does read from right-to-left. (Try it and see.)

Note. You say you don’t have any idea what an HTA is, and you don’t really understand what it means to add an HTML control? Then you need to check out the HTA Developers Center here in the Script Center.

Because we have some time to kill (no baseball game tonight), we thought we’d toss in some bonus code, just for the heck of it. The following Web page/HTA has two buttons on it: not only does it have the Run Script button but it also has a button labeled Switch Direction. When you click the Switch Direction button the following subroutine runs:

Sub SwitchSub
    If ScriptArea.dir = “ltr” Then
        ScriptArea.dir = “rtl”  
    Else
        ScriptArea.dir = “ltr”
    End If     
End Sub

As you can see, this subroutine checks the value of ScriptArea’s dir property. If dir is equal to ltr, then the value is changed to rtl; if the value is not equal to ltr (meaning it must be equal to rtl) then the value is changed to ltr. To put all that in somewhat plainer English, the button simply toggles ScriptArea between right-to-left and left-to-right. Click the button once and the text box reading direction will be left-to-right; click it a second time, and the reading direction switches back to right-to-left. Etc. etc.

Here’s the complete code:

<SCRIPT LANGUAGE=”VBScript”>
    Sub TestSub
        Msgbox ScriptArea.Value       
    End Sub
    Sub SwitchSub
        If ScriptArea.dir = “ltr” Then
           ScriptArea.dir = “rtl”  
        Else
           ScriptArea.dir = “ltr”
        End If     
    End Sub
</SCRIPT>
<body>
    <textarea name=”ScriptArea” rows=5 cols=70 dir=”rtl”></textarea><p>
    <input id=runbutton  type=”button” value=”Run Script” onClick=”TestSub”>
    <input id=switchbutton  type=”button” value=”Switch Direction” onClick=”SwitchSub”>
</body>

How Can I Add a Right-to-Left Text Box to a Web Page?

ScriptingGuy1

Read next

0 comments