How Can I Clear a List Box in an HTA?

How Can I Clear a List Box in an HTA?

  • Comments 3
  • Likes
Hey, Scripting Guy! Question

Hey, Scripting Guy! How can I clear a list box in an HTA?

-- AK

SpacerHey, Scripting Guy! AnswerScript Center

Hey, AK. For those of you who aren’t familiar with the term, an HTA - among other things - is a way to use Internet Explorer to provide a graphical user interface for your scripts. (If that still doesn’t answer your questions, don’t despair. Instead, stay tuned for April 11th when we debut our new HTA Developers’ Center.) With an HTA (short for HTML Application) you can make your system administration scripts look - and run - like real applications, applications complete with radio buttons, text boxes, check boxes, and, yes, list boxes.

So suppose you do have a list box, one with a bunch of items (technically known as options) already in it. In other words, something that looks like this:

Listbox


Suppose that you want to remove all of those options, leaving you with a nice, clean, empty list box. How can you do that?

To begin with, as far we know there’s no single command that can clear all the options in a list box. But that’s OK; even if we can’t clear all the options at once, we can clear the options one at a time using the RemoveNode method. All we have to do is iterate through the all the options in the list box and then delete each one. We can do that by adding a subroutine (in this case, a subroutine named ClearListbox) to our HTA:

Sub ClearListbox
    For Each objOption in AvailableOptions.Options
        objOption.RemoveNode
    Next 
End Sub

Note. This subroutine assumes that the list box we want to clear is named AvailableOptions.

As you can see, we create a For Each loop that loops through all the Options in the list box named AvailableOptions. For each option we find (and, remember, the options correspond to the items in the list box), we call the RemoveNode method to remove that option. By the time the For Each loop is done, we will have found - and removed - every item in the list box.

The only other thing we need to do is add a button to our HTA; this button, when clicked, will call the ClearListbox subroutine. Here’s some HTML that will add a button like this to our HTA:

<input id=runbutton  class="button" type="button" value="Clear Listbox" 
name="run_button"  onClick="ClearListbox"><p>

That’s all we have to do. If we run our revised HTA and click the Clear Listbox button, all the options in the list box will be removed, and our HTA will look like this:

Listbox


Breath-taking, isn’t it?

If you’d like to try this out for yourself, here’s code that will bring up an HTA with a list box pre-populated with 8 items. Click Clear Listbox and all 8 items will be deleted. To use this sample code, copy it, paste it into Notepad, and then save it with a .hta file extension (for example, listbox.hta). Then just double-click the file in My Computer or Windows Explorer, and see what happens.

Here’s the HTA code:

<html>
<head>
<title>Clear a Listbox</title>
</head>

<SCRIPT Language="VBScript">

Sub ClearListbox
    For Each objOption in AvailableOptions.Options
        objOption.RemoveNode
    Next 
End Sub

</SCRIPT>

<body bgcolor="buttonface">

<select size="8" name="AvailableOptions" style="width:400" >
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
<option value="1">Option 5</option>
<option value="2">Option 6</option>
<option value="3">Option 7</option>
<option value="4">Option 8</option>
</select>

<p>
<input id=runbutton  class="button" type="button" value="Clear Listbox" 
name="run_button"  onClick="ClearListbox"><p>

</body>
</html>
Your comment has been posted.   Close
Thank you, your comment requires moderation so it may take a while to appear.   Close
Leave a Comment
  • Ok, this is clearing my OPTIONs ; but this is not clearing my OPTGROUPs.  How do I clear the groups?

    I.e. groups added with the following VBScript code:

               set oSelect = document.getElementById("AvailableOptions")

               Set oGroup = Document.createElement("OPTGROUP")

               oGroup.Label = sText

               oSelect .AppendChild(oGroup)

    Thanks

  • Actually, this seems to work to remove the OPTGROUPs:

       For Each oChild In AvailableOptions.Children

           oChild.RemoveNode

       Next

    Thanks

  • <html>

    <head>

    <script language="vbscript">

       Sub doit()

           Set element=document.getElementById("sel1")

           set tags= element.getElementsByTagName("optgroup")

           For Each tag In tags

               MsgBox tag.label

               element.removeChild(tag)

           Next

       End sub

    </script>

    </head>

    <body>

    <select id="sel1">

     <optgroup label="Swedish Cars">

       <option value="volvo">Volvo</option>

       <option value="saab">Saab</option>

     </optgroup>

     <optgroup label="German Cars">

       <option value="mercedes">Mercedes</option>

       <option value="audi">Audi</option>

     </optgroup>

    </select>

    <input type="button" onclick="doit" value="doit">

    </body>

    </html>