Dynamically Populating ComboBox or Select Option

Hi all,

Is it possible to populate a ComboBox or Select element via script after the page has loaded I want to have a drop-down with a dynamic list of items in my settingsUI, but can't seem to add items or options to boxes. Also, I am trying to do this with vbscript. It would be best if I could repopulate the drop-down on drop-open (onbeforeactivate ), so that it was always up to date, but if there is a way to at least add a dynamic list once on or before load that would work too.

I have tried various approaches to the Select element, mostly similar to the technique here: http://www.microsoft.com/technet/scriptcenter/resources/qanda/aug05/hey0815.mspx
Like with the ComboBox below, scripts running in my Windows Sidebar gadget just quit when I attempt to selectName.add newOptionElement

I have attempted to work with the ComboBox also, as described here: http://www.microsoft.com/technet/scriptcenter/topics/activex/combobox.mspx
I have used ComboBoxes before in other situations, so I think I have the syntax and everything right, but the scripts just quit at ComboBox1.addItem "Sample" or any variation thereof.

I can probably find another method of making these options available to users of my gadget, but a ComboBox would be the best solution. Can Windows Sidebar gadgets have dynamically populated select-lists, and if so, how can I do it

Thanks!

Answer this question

Dynamically Populating ComboBox or Select Option

GMan5309
Right on, Rick! I don't know javascript very well, but your example was easy enough for me to get a sample working, so I knew it was not a gadget limitation. vbscript is required, though, so I returned to that, and tried to use your interesting array syntax. No luck with that directly, but, I did find my problem!

I was just referring to the Select or ComboBox by its name or id, at different times. This seemed OK because some things worked and the intellisense in Expression Web showed the methods. But the proper way to refer to them is through a

Set objSelect = document.getElementById("selectID")

you can then

Set optElem = document.createElement("Option")
optElem.text = "OptionText"
optElem.value = "OptionValue"
objSelect.add optElem

for example!
Zadoras
Glad you got it working. Keep in mind though ... all IDs are globally available in IE so there's no need to use getElementById. It's a good practice for cross-browser pages but not needed for the Sidebar.

-Rick
MarkNyats
I guess you're right. Don't know why all earlier experiments failed, but got this example working with Select anyway.

<html>

<head>

<script type="text/vbscript" language="vbscript">
Sub Window_OnLoad
StatusText.innerText = "Window Loaded..."
End Sub

Sub GetElemAddItem
StatusText.innerText = "Attempting Add Using getElementByID..."
Dim objSelect, newElem
Set newElem = document.createElement("Option")
newElem.value = "New Value"
newElem.text = "Scripted Option"
Set objSelect = document.getElementById("Select1")
objSelect.add newElem
Set newElem = Nothing
Set objSelect = Nothing
StatusText.innerText = "Add Using getElementByID Successful!"
End Sub

Sub UseIDAddItem
StatusText.innerText = "Attempting Add Using ID Directly..."
Dim newElem
Set newElem = document.createElement("Option")
newElem.value = "New Value"
newElem.text = "Scripted Option"
Select2.add newElem
StatusText.innerText = "Add Using ID Directly Successful!"
End Sub

</script>

</head>

<body style="width:256px;height:256px;">

<select id="Select1" style="width:128px;">
<option>Hardcoded Option1</option>
<option>Hardcoded Option2</option>
<option>Hardcoded Option3</option>
</select>
<input id="Button1" type="button" value="Get Elem" onclick="GetElemAddItem">
<br>
<select id="Select2" style="width:128px;">
<option>Hardcoded Option1</option>
<option>Hardcoded Option2</option>
<option>Hardcoded Option3</option>
</select>
<input id="Button2" type="button" value="Use ID" onclick="UseIDAddItem">
<br>
<span id="StatusText">Script Uninitialized</span>

</body>

</html>

Thanks for your help, sorry for my confusion! I'm new to incorporating HTML into vbscript, and sometimes it's getting just the right combination of new bits together. :)
XNA Rockstar
Google is your friend!

Have a look here, there's a few dynamic combos there with the code. I doubt you'll be able to do it in VB though, you'll need to use Javascript.
spennington
Try this (javascript):

ComboBox1[ComboBox1.length] = new Option("text", "value");

Works fine under the sidebar.

To clear the combo box to populate it with a new set of data just do:

ComboBox1.length = 0;

-Rick
Dynamically Populating ComboBox or Select Option

Answer this question