Set an Option of a SELECT control with Javascript.

General
1

Hi buddies!

I’m making a project that interacts with a webpage, in order to catch download links get and set values of Webpage controls like: Buttons, INPUT, Radiobuttons and Select HTML objects.

For get and set values of the radio buttons and Input controls I have no problem.

The problem is to set an option of a SELECT control. I only can get the selected value and get the selected index.
But I can’t set it.

That’s what I’m doing:

document.getElementById(‘DdlAnio’).selectedIndex //////////////Get the selected Index
document.getElementById(‘DdlAnio’).value//////////// Get the selected value.

I’m reading in W3Schools that doing this Works for set an option in Select, but doesn’t work for me, I tested in TryIt and jsFiddle with an example of select control and works.

But when I’m trying to set the values on the desired page, It doesn’t work:

document.getElementById(‘DdlAnio’).selectedIndex = ‘2’ //////////////Set the selected Index
document.getElementById(‘DdlAnio’).value = ‘2013’’ ////////Set the selected Value

W3Schools - selectedIndex Property

This to try to set ‘2013’ value.

And this is a part of source code, where appears that control:


2011
2012
2013
2014
2015

The web page is not mine, cuz of this I can’t edit the code, and I using an HTMLViewer to view the results and Execute Javascript to do the Js Code:

Dim JsElement As String= “setOption();” _
+“function setOption() {” _
+“document.getElementById(‘DdlAnio’).selectedIndex = ‘2’” _
+"}" _

HTMLViewer1.ExecuteJavaScript(JsElement)

But I can’t results, what Am I doing wrong?

2

I discovered something, running a simulacra on TryIt from W3Schools, I paste the same code and try to do the code:
And the Select Control doesn’t Appear, and when I remove the word: “display: none” the control appears and the SelectIndex Works.

Is there a way to avoid this in xojo to get the code working?

Thanks

3

I ve read in another forum, in this class of controls, first i need to change the attribute to be visible, after this then selectindex to set the desired value of the list

4

I solved it.
That webpage does the follow:
Create a custom control based on Select and buttons. And the original controls are hidden using CSS Atribute: display:none

I remove this attribute setting with a new one: document.getelementbyid(ddlanio).setattribute(‘style’,‘width=80px’)
And then using select index or value to change the desired option