SHOW HIDDEN ERROR MESSAGE

Show, hide, and keep those interactions alive!

First, open AxureShowHiddenWidget.rp and open the "Show Hidden Widget" page.

 

In this example, we'll create an error message that shows when the login fails.

 

Drag and drop a Rectangle widget from the Widgets pane to the design area under the Login button.

While the Rectangle is selected:

 

Go to the top of the Widget Interactions and Notes pane and name the widget "Error Message".

Features

Learn

Community

Company

Buy

Download

Axure Share

Forum

Manage Licenses

Home

Features

Community

Learn

Support

Company

Download

Buy

Contact

Privacy

Legal

Sitemap

© 2002-2014 Axure Software Solutions, Inc. All rights reserved. Axure is a registered trademark of Axure Software Solutions Inc.

u59_start u59_end u59_line

Patents

Use the formatting tools to create a red box with white text for your error message that reads:

 

"Incorrect Login Information. Please try again."

Now, let's add interactions to the "Log In" button. For the first case, we want to open the "My Account" page if the login succeeds.

 

Select the Log In button on the design area. Add a case to the OnClick event, and change the case name in the top left of the case editor to, "Successful Login". Then, add an action to "Open Link" and choose the "My Account" page.

 

Click "OK" to close the Case Editor.

For the second case, we want to show the error message if the login fails.

 

Add a second case to the OnClick event with the case name "Failed Login". Then, add an action to "Show", choosing "Error Message". Click "OK".

Preview the prototype by clicking the preview icon in the toolbar. You'll see that clicking on the Login button will present the two cases. Clicking "Successful Login" takes you to the My Account page, and clicking "Failed Login" shows the error message.

Step 1: Add a

Rectangle widget

Step 2: Name the widget

Step 3: Design

the error message

Step 4: Set the

Widget to hidden

Step 5: Add case

for "Successful Login"

Step 6: Add case

for "Failed Login"

Step 7:

Preview the prototype

BASIC INTERACTIONS

Show Hidden Widget Tutorial

DOWNLOAD

u142_start u142_end u142_line
u144_start u144_end u144_line
u146_start u146_end u146_line
u148_start u148_end u148_line
u150_start u150_end u150_line
u152_start u152_end u152_line

Still need help? Check out the forum or drop us a line at support@axure.com.

THE ROUND UP

u161_start u161_end u161_line

MORE BASIC INTERACTIONS TUTORIALS ::

With the Rectangle selected, toggle the "visible" option in the Style Tab. This hides the widget by default on the page and you'll see a yellow mask.