Copy & Paste Select Options from a Web Page

Introduction

Something that's always bugged me when I've looked after web based systems is struggling to grab a list of options from drop-down boxes on a web page. Sometimes you just want to be able to select them all, press control+v and paste them into an email.

Until now, the only way I found to get the list of options was to view the web page source, locate the <option> tags from the <select> and then manually hack the code about until you are left with a simple list.

... it's not exactly easy.

I've put up with this method for years for the odd quick request, but today I needed to get lists from 42 select boxes, and I didnt want to spend all day doing it.

There had to be a better way!!!

The Solution

I use Firefox for most of my web development and queries, mainly because of firebug, and I found this great add-on called SelectBoxTools which among other things allows you to copy options into a comma separated list.

Right-click from within your select box, and when the menu appears go down to SelectBoxTools > Copy as comma-separated text.

SelectBoxTools options.

Then when pasted into a text editor you'll get the visible name and it's value as a list. eg:-

 PK_ID,Pk Id
 OS,Os
 AVAILABILITY,Availability
 SUPPORT_DATE,Support Date
 RISK_LEVEL,Risk Level
 RATIONALE,Rationale
 NOTES,Notes

If you want to use the SelectBoxTools > Selection option, you'll need to select one of the picklist options on your web form first or you'll get the error:-

  TypeError:this.focused.options[this.focused.selectedIndex] is undefined

 Simple, effective and fast.