2

I am trying to use a headless browser (Firefox Marionette) to drive a drop-down selection process on a website I do not control. The setup is as follows: there's

  • a drop-down menu where I can make a selection
  • a second drop-down menu that reloads when I click my selection in the first one, exposing more options than it initially displays.

Clicking in a browser works fine, but if I try to do this in a console, the second menu does not reload:

var sel1 = document.getElementById("1stmenu")
sel1.value="my selection"
sel1.selectedIndex=1

This changes the first drop-down menu appropriately, but does not trigger the 2nd menu's reload; the latter remains blank, displaying no options.

grobber
  • 1,083
  • 1
  • 9
  • 20

1 Answers1

0

This had (essentially) been asked before, here. The first answer worked for me: the drop-down menu is something like

<select class="classname" id="idname" name="selname">
 <option value="" selected="selected">----- Choose -----</option>
 <option value="valuenamehere">Blah</option>
</select>

and what did the trick, after making jQuery available in the console, was

$('select[name="selname"]').val("valuenamehere").trigger('change');

Edit:

Even better: there's no need for jQuery at all, as documented in this earlier question (also in an answer to a duplicate question). All I had to do was

document.getElementsByName("selname")[0].value="valuenamehere"
document.getElementsByName("selname")[0].dispatchEvent(new Event('change'))
grobber
  • 1,083
  • 1
  • 9
  • 20