[[This article is relevant for versions of Axure RP prior to 4.4. Since 4.4, there is a new event called the OnChange event on droplists that allows you to more easily accomplish this.]]
A number of people have asked how to use Axure RP to design a droplist that will link to a page after selecting a droplist option in the prototype.
The solution we have been considering is to make the prototypes data aware, support conditional logic, and add an OnSelect event to the droplist. Users could then define an interaction on the droplist that would implement "OnSelect If droplistvalue = value, Open page in Current Window".
This is definitely still in consideration, but in the meantime, we found a way to simulate this using dynamic panels.
Here is a sample file: DroplistOnSelectSample.rp
In this sample there are two droplists that change the state of a dynamic panel on the page (they could just as easily link to various pages).
The first does this by having multiple cases on the OnClick event of the droplist. When you click on the droplist in the prototype, the popup with the cases appears for the user to click just like if there were multiple cases on a button. This is simple to implement, but if you want to avoid showing the popup of cases in the prototype, take a look at the second droplist.
The second droplist is created using two dynamic panels rather than the droplist widget. One panel has states each containing an image of the droplist with a droplist value in it. The other panel has a single state representing the droplist options created using rectangle widgets and is set to hidden by default. An image map is placed over the dynamic panel with the droplist states and has an interaction that toggles the visibility of the options when clicked.
Here is the resulting prototype.
If your droplist is designed to link to different pages, this becomes even easier since you will not need to use a dynamic panel to show the droplist with different values. You will only need the dynamic panel containing the options.
