How to Select a Drop Down Menu With Applescript
NEW! AppleScript Maker Beta: Hey Everyone, I am working on a new AppleScript tool that is going to BLOW YOUR MIND! After reading this tutorial use this tool to easily build your AppleScripts. Click Here!
In a previous tutorial we covered how to use AppleScript to fill out text forms on a webpage. Now we are going to learn how to automate selecting information from a dropdown, or select menu in a form.
Before proceeding please read How to Fill Out Forms on Websites with AppleScript. This will be very helpful in understanding what is going on here.
First thing is first, go to the web page that you need to fill out a form for…in this case we will use the following select box as an example:
Please use this box to test your code on.
Next, in Google Chrome, we are going to right click on this select box and click inspect element …
This will split your window into an upper half with the website, and the bottom half that displays the source code.
You will see the following code:
<select id=”carsID” class=”carsClass” name=”cars”>
<option value=”volvo”>Volvo</option>
<option value=”saab”>Saab</option>
<option value=”mercedes”>Mercedes</option>
<option value=”audi”>Audi</option>
</select>
If we look at this code we can see that there are 3 ways we can use to identify this select box.
- ID which is “carsID”
- Class which is “carsClass”
- Name which is “cars”
Inputting values into a Dropdown using ID
We are going to look at id=”carsID”…
Next we enter the following code into our AppleScript editor. This code is a function that we can call at anytime in our script.
to inputByID(theId, theValue) -- creates the function tell application "Safari" -- tells AppleScript to use Safari do JavaScript " document.getElementById('" & theId & "').value ='" & theValue & "';" in document 1 -- gets the ID that we specified and then inputs the value we specified into the ourform end tell -- stops using safari end inputByID --marks the end of the function
To call this function, or to use it when we want we need to know what are the names of the values in the dropdown options.
In this case there are four options:
<option value=”volvo”>Volvo</option>
<option value=”saab”>Saab</option>
<option value=”mercedes”>Mercedes</option>
<option value=”audi”>Audi</option>
Basically we are doing the same thing as if this were a text box, but instead it is a drop down. Also, the choices that you have are limited to only these four options.
So if we wanted to select saab we would put this code in our Applescript document:
inputByID("carsID", "saab")
Which when run will produce the result…
Inputting values into a form using Class
This time we are going to look at the Class attribute …
class=”carsClass”
As you can see we will be using “carsClass” as our class identifier.
Now we enter this slightly changed code into our AppleScript editor:
to inputByClass(theclass, num, theValue) tell application "Safari" do JavaScript " document.getElementsByClassName('" & theclass & "')[" & num & "].value ='" & theValue & "';" in document 1 end tell end inputByClass
And to call the function, we use the following code:
inputByClass(“carsClass”, 0, “audi”)
For a better understanding of this code please read the clicking buttons on a web page tutorial. Which has a more in depth explainaton of using class name and Applescript.
Inputting values into a form using Name
Just as above we are going to find the attribute in the code that says “Name”. In this case the Name of this element in this form is “cars”.
name=”cars”
Now we input this code into our Applescript editor:
to inputByName(theName, num, theValue) tell application "Safari" do JavaScript " document.getElementsByName('" & theName & "')[" & num & "].value ='" & theValue & "';" in document 1 end tell end inputByName
And we call it in our script with…
inputByName("cars", 0, "mercedes")
Just like above we need to figure out which instance of the Name to use in order to fill out the middle “num” value in our function.
Inputting values into a form using Tag Name
Enter the following code into your AppleScript editor:
to inputByTagName(thetagName, num, theValue) tell application "Safari" do JavaScript " document.getElementsByTagName('" & thetagName & "')[" & num & "].value ='" & theValue & "';" in document 1 end tell end inputByTagName
Then you call the function use…
inputByTagName("select", 0, "saab")
NOW if you combine this script with the tutorial on clicking buttons on a web page and how to use AppleScript to fill out text forms on a webpage you can automatically fill out almost any online form using AppleScript!
Hi, how would I select an option based on the inner HTML of the option? Thanks.