Pass variables a otra página en Axure

Home »  Axure »  Pass variables a otra página en Axure

On abril 8, 2013, Posted by , In Axure,prototype,UI Design,wireframe, With Comentarios desactivados

Variables Tutorial

Pass Text to Next Page

This Variables tutorial shows you how to pass text input from one page and display it on a linked page.  It uses variables and the OnPageLoad event.
This zip file contains the RP file needed to complete this tutorial

Pass Entered Values from Page to Page
Step 1: Add OnClick case to Submit button 
 
First, open PassTextToNextPage.rp and open the “Pass Text to Next Page” page.
Select the Submit Button in the wireframe and add a case to the OnClick event. This opens the Case Editor dialog.
Step 2: Store Namefield text in a variable

In the Case Editor, add an action to “Set Variable/Widget value(s)” and click Open Set Value Editor.
In the Set Variable and Widget Values dialog, set “value of variable OnLoadVariable equal to text on widget NameField”. This stores the value entered in the NameField text field in the variable OnLoadVariable.

Click OK to close dialog

Step 3: Add action to open Page 1
 
 

With the Case Editor still open, add an action to the existing case to “Open Link in Current Window” and choose Page 1. It’s important to note here that this action needs to come AFTER setting the variable value–if we opened the page first, the variable value would never be set. Click OK to close the Case Editor dialog.
Clicking the Submit button will now set the variable to whatever the user enters in the text field, and open Page 1.

 Step 4: Add OnPageLoad case to Page 1

Next, open Page 1 from the Sitemap pane. Here, we want to insert the text value stored in the OnLoadVariable into the welcome text on the page.
In the Page Interactions tab of the bottom pane, add a case to the OnPageLoad event.
 Step 5: Set text on Welcome Text Panel widget


 

In the Case Editor, add an action to “Set Variable/Widget value(s)” and click Open Set Value Editor.
In the Set Variable and Widget Values dialog, set “text on widget Welcome Text Panel equal to value” and click Edit Text.
 Step 6: Insert variable value to text

 

In the Enter Text dialog, place your after the “Welcome ” text. In the Insert Variable or Function dropdown menu to the right, choose OnLoadVariable. This inserts [[OnLoadVariable]] to the text. Whatever value is stored in the OnLoadVariable will replace this text.
Click OK to close the open dialogs.

 Step 7: Generate the prototype 

 
 Generate your prototype and test it out. Clicking the submit button sets the value of the variable, opens the next page, and inserts the value into the Welcome text.

The Round Up
Did you pass the test for passing text?

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

Vía: @mvertigo
Fuente: axure.com

Comments are closed.