AxureEx API

AxureEx is a custom extension to the Axure API. It can be downloaded here.

AxureEx is consists of some webfonts that inject javascript and CSS into your Axure prototypes. More information about enabling AxureEx can be found here.

The additional javascript functionality provided by AxureEx is described on this page.

$axure(query)

$axure(query).exIsVisible(options) or $axure(query).isVisible(options)

TBD

$axure(query).exGetBounds(all) or $axure(query).getBounds(all)

Get size and position of first or all widgets of query. See $axure.ex.getBounds(elementId).

Bug: The size and position of hidden widgets is not returned correctky.

TBD

$axure(query).exGetWidgetInfo(all) or $axure(query).getWidgetInfo(all)

Get size and position of the first or all widgets of query. See $axure.ex.getWidgetInfo(elementId).

TBD

$axure(query).exGetPanelState() or $axure(query).getPanelState()

Get the number of the current panel state.

$axure(query).exGetPanelStateName() or $axure(query).getPanelStateName()

Get the name of the current panel state.

$axure(query).exGetPanelStates() or $axure(query).getPanelStates()

Get the names and indexes of dynamic panel states.

$axure(query).exGetParent(all, state)

Get id of the parent of one or more widgets. This function always returns a parent that exist in the DOM.

If all is true then the parent of all widgets is returned. Otherwise only the parent of the first widget is returned.

If state is true the id contains the dynamic panel state if the parent is a dynamic panel.

$axure(query).exSetPanelStateByName (name) or $axure(query).setPanelStateByName (name)

Set the state of dynamic panels.

$axure(query).exGetRepeaterRows() or $axure(query).getRepeaterRows()

var rows = $axure('@widget').getRepeaterRows();
void(0);

$axure(query).exMarkRepeaterRows(rows) or $axure(query).markRepeaterRows()

$axure('@widget').markRepeaterRows($axure('@widget').getRepeaterRows());
void(0);

$axure(query).exUnmarkRepeaterRows(rows) or $axure(query).unmarkRepeaterRows()

$axure('@widget').unmarkRepeaterRows($axure('@widget').getRepeaterRows());
void(0);

$axure(query).exRefreshRepeater() or $axure(query).refreshRepeater()

$axure('@widget').refreshRepeater();

$axure(query).exCopyRepeaterData(query) or $axure(query).copyRepeaterData(query)

Copy data from one repeater to another repeater. Remember to refresh the repeater.

$axure('@targetWidget').copyRepeaterData($axure('@sourceWidget'));

$axure(query).exUpdateRepeaterData(target, row) or $axure(query).updateRepeaterData(target, row)

Update data rows in a repeater. Remember to refresh the repeater.

Target can be the text marked, a row-id, a widget-id, an array of row-id or an array of widget-id.

$axure('@widget').updateRepeaterData('marked', {
  valueName: {type: 'text', text: 'Hello World'}
});

$axure(query).exGetTextData(rows, columns, separator) or $axure(query).getTextData(rows, columns, separator)

Convert text into data rows. The rows and columns values are ignored. The separator value define the character

$axure(query).exGetRepeaterData(rows, columns) or $axure(query).getRepeaterData(rows, columns)

Get the data rows from a repeater.

$axure(query).exClearRepeaterData() or $axure(query).clearRepeaterData()

Remove all data rows from a repeater. Remember to refresh the repeater.

$axure(query).exAddRepeaterData(rows) or $axure(query).addRepeaterData(rows)

Add data rows to a repeater. Remember to refresh the repeater. Update data rows in a repeater. Remember to refresh the repeater.

$axure(query).exSetRepeaterLimit(limit) or $axure(query).setRepeaterLimit(limit)

Set the page limit for a repeater. The limit must be undefined (no limit) or an integer. Remember to refresh the repeater.

$axure.ex

$axure.ex.getBounds(elementId)

Bug: This function does not work on hidden widgets. Using the native Axure API functions available in Axure 8.

Get bounds of widget with given elementId. Returns an object with the following properties;

`x` or `left`	Left positon
`y` or `top`	Top position
`with`	Width
`height`	Height
`right`	Right position (left + width)
`bottom`	Bottom position (top + height)
`id`	Widget id

alert($axure.ex.getBounds("u4").left);

$axure.ex.getGlobalVariables(option)

Get all global variables.

$axure.ex.scrollBarSize()

Get size of scrollbars.

alert($axure.ex.scrollBarSize());

$axure.ex.childOf(widgets, parents, deep)

Find widgets that are children of other widgets.

If deep is false the children must be direct descendants of the parents.

$axure.ex.childOf('@child', '@parent').hide();

$axure.ex.parentOf(widgets, children, deep)

Find widgets that are parents of other widgets.

If deep is false the parents must be direct ancestors of the children.

$axure.ex.parentOf('@parent', '@child').hide();

$axure.ex.ownerContains(widgets, owner)

Find widgets that are owned by a page or master.

$axure.ex.ownerIs('@master@').hide(); // The name of the owner must be "master"
$axure.ex.ownerIs('master').hide(); // The name of the owner must contain the text "master"

$axure.ex.labelContains(widgets, label) or $axure.ex.labelContains(label)

Find widgets that contain a substring in their name.

$axure.ex.labelContains('hello').hide(); // Any name that contains hello
$axure.ex.labelContains('@hello').hide(); // Any name that begins with hello
$axure.ex.labelContains('hello@').hide(); // Any name that ends with hello
$axure.ex.labelContains('@hello@').hide(); // Only the name hello

$axure.ex.go(state, updateVariables, forwardVariables, replace)

Go to a new state and remember old state in browser history.

`state`	The name of the new state or the number of states to go backward or forward.
`updateVariables`	A list of variabes that will be updated in the URL
`forwardVariables`	An object with values that will be passed to the next state
`replace`

$axure.ex.go('Checkout', 'scrollTop,selected', {}, false);
void(0);

$axure.ex.forward(state, forwardVariables, replace)

Prepare jumping to a new page. After calling this function use the open page in current window action to jump the new page.

`state`	The state of the new page
`forwardVariables`	Variables to be set in new page state
`replace`	Replace the current page with the new page in browser history. Use the `open page in new window/tab` action to jump to the new page.

$axure.ex.forward('Checkout', {items: ['a', 'b', 'c']}, false);
void(0);

$axure.ex.updateVariables(variables)

Update selected variables in URL. If Axure page navigation panel is open, this does not work if the page is refreshed.

$axure.ex.updateVariables('example,anotherExample');
$axure.ex.updateVariables(['example', 'anotherExample']);
$axure.ex.updateVariables({example: 'Value'});
void(0);

$axure.ex.getWidgetInfo(elementId)

Get size and position of a widget.

$axure.ex.getRepeaterRows(repeaterId)

Get all data rows in a repeater.

var rows = $axure.ex.getRepeaterRows($axure('@widget').getElementIds()[0]);
void(0);

$axure.ex.markRepeaterRows(repeaterId, rows)

Mark data rows in a repeater.

var id = $axure('@widget').getElementIds()[0];
$axure.ex.markRepeaterRows(id, $axure.ex.getRepeaterRows(id));
void(0);

$axure.ex.unmarkRepeaterRows(repeaterId, rows)

Unmark data rows in a repeater.

var id = $axure('@widget').getElementIds()[0];
$axure.ex.unmarkRepeaterRows(id, $axure.ex.getRepeaterRows(id));
void(0);

$axure.ex.refreshRepeater(repaterId)

Refresh (render) a repeater. A repeater must be refreshed before changes to the repeater data becomes visible.

var id = $axure('@widget').getElementIds()[0];
$axure.ex.refreshRepeater(id);
void(0);

$axure.ex.copyRepeaterData(targetId, sourceId)

Copy data from one repeater to another repeater. Remember to refresh the repeater.

$axure.ex.getTextData(text, rows, columns, separator)

Convert text into data rows. The rows and columns values are ignored. The separator value define the character separating items on a row of text.

$axure.ex.getRepeaterData(repeaterId, rows, columns)

Get the data rows from a repeater.

$axure.ex.clearRepeaterData(repeaterId)

Remove all data rows from a repeater. Remember to refresh the repeater.

$axure.ex.addRepeaterData(repeaterId, rows)

Add data rows to a repeater. Remember to refresh the repeater.

$axure.ex.updateRepeaterData(repeaterId, target, row)

Update data rows in a repeater. Remember to refresh the repeater.

$axure.ex.setRepeaterLimit(repeaterId, limit)

Set the page limit for a repeater. The limit must be undefined (no limit) or an integer. Remember to refresh the repeater.

Axure.Ex.History

The history object enable storage of information across pages. It only works when the pages are loaded from a web server - it does not work if when pages are loaded from local files.

$axure.ex.history.current

alert($axure.ex.history.current.myValue);
$axure.ex.history.current.myValue = "You can read this value when you go back to this page.";

$axure.ex.history.previous

alert($axure.ex.history.previous.myValue);
$axure.ex.history.previous.myValue = "You can read this value when you go back to the previous page.";

$axure.ex.history.session

alert($axure.ex.history.session.myValue);
$axure.ex.history.session.myValue = "You can read this value on any page in this session.";

$axure.ex.history.local

alert($axure.ex.history.local.myValue);
$axure.ex.history.local.myValue = "You can read this value of any page.";

Axure.Ex Functions

The Open link in new window/tab hack enables execution of javascript. It can however also be useful to execute javascript in Axure expressions. By Axure expression I mean the stuff that can be put inside [[ ]] in many actions.

I have managed to add javascript execution to expressions by “overloading” the trim function. The normal trim function does not take any arguments. I have overloaded the trim function so that calling the trim function with one or more arguments has new meanings.

The string you call the trim function on specify the name of the function to call. The arguments you specify for the trim function are passed to the called function. An example [["myFunction".trim(this)]].

To define a function that can be called do this;

$axure.ex.fn.myFunction = function (widget) {
    $axure('#' + widget.elementId).hide();
};

The Axure.Ex library comes with a number of predefined functions. They are described here.

[["log".trim("message"[, "message])]]

Write text to the javascript console.

[["log".trim("hello", "world")]]

[["alert".trim("hello", "world")]]

Show alert.

[["alert".trim("hello", "world")]]

[["select".trim(1, "a", "b", "c")]]

Select one of multiple arguments. The first argument can be;

An integer
A boolean

[["select".trim(1, "a", "b", "c")]] // "a"
[["select".trim(2, "a", "b", "c")]] // "b"
[["select".trim(false, "a", "b")]]  // "b"

[["id".trim(widget [, hash])]]

Return the id of the given widget.

[["id".trim("this")]] // "#u272"
[["id".trim("this", true)]] // "#u272"
[["id".trim("this", fals)]] // "u272"%%**''

[["parent".trim(widget, levelOrName, deep)]]

If levelOrName is a string, then return the nearest parent that match the string (eg. “@name”). If deep is false, then the parent must be the immediate parent.

[["parent".trim(this, "@parent@")]] // "u123"

If levelOrName is a number, then return the parent at that level. The immediate parent is at label 1.

[["parent".trim(this, 1)]] // "u123"

If levelOrName is undefined, then return the parent at level 1.

[["parent".trim(this)]] // "u123"

[["sibling".trim(widget, indexOrName)]]

Fix me.

[["sibling".trim(this)]] // "u123"

[["child".trim(widget, indexOrName, deep)]]

If indexOrName is a string, then return the nearest child that match the string (eg. “@name”). If deep is false, then the child must be an immediate child.

[["child".trim(this, "@child@")]] // "u123"
[["child".trim(this, "@child@", false)]] // "u123"

If indexOrName is a number, then return the child at that index. The first child is at index 1. The value of deep is ignored.

[["child".trim(this, 1)]] // "u123"

If indexOrName is undefined, then return the child at index 1. The value of deep is ignored.

[["child".trim(this)]] // "u123"

[["state".trim(panel)]]

Get state of dynamic panel.

[["state".trim(this)]] // "name of state"

[["enabled".trim(widget [, value])]]

Get or set “disabled” state of widget.

[["enabled".trim(this)]] // true or false
[["enabled".trim(this, true)]] // set disabled to false

[["selected".trim(widget, value)]]

Get or set “selected” state of widget.

[["selected".trim(this)]] // true or false
[["selected".trim(this, true)]] // set selected to true

[["var".trim(name, value)]]

Get or set variable. Variables are stored in the global $var object.

[["var".trim('hello')]] // $var.hello
[["var".trim('hello', 'world')]] // $var.hello = 'world'

[["history".trim(name, value)]]

Get or set history variable. Prototype must be hosted on a server.

[["history".trim('hello')]] // $axure.ex.history.current.hello
[["history".trim('hello', 'world')]] // $axure.ex.history.current.hello = 'world';

[["session".trim(name, value)]]

Get or set session variable. Prototype must be hosted on a server.

[["session".trim('hello')]] // $axure.ex.history.session.hello
[["session".trim('hello', 'world')]] // $axure.ex.history.session.hello = 'world';

[["script".trim(script)]]

Execute the given script and return the result of the script. The result of the script is the value of the last expression in the script. In this example an alert with the text “Hello” is shown, and the expression evaluates to “World”;

[["script".trim("alert('Hello');'World';")]]

[["css".trim(widget, selector, name, value, ...) ]]

Set css properties of widget.

[["css".trim(this,, "color", "red")]]
[["css".trim(this, "input", "color", "red")]]
[["css".trim("@name",, "color", "red")]]
[["css".trim("@name", "input", "color", "red")]]

[["getData".trim(widget[, index], name)]]

Get data from a repeater.

Get data from current row in repeater.

[["getData".trim(this, "columnName")]]

Get data from indexed row in repeater.

[["getData".trim(this, 2, "columnName")]]

[["setData".trim(widget[, index], name, text | widget, ...)]]

Set data in repeater. The repeater is not refreshed. Works well for updating repeater data without generating new html.

Set data in current repeater row. If a widget is specified then the image of that widget is stored.

[["setData".trim(this, "columnName", "value")]]
[["setData".trim(this, "columnName", fromWidget)]]

Set data in indexed repeater row. If a widget is specified then the image of that widget is stored.

[["setData".trim(this, 2, "columnName", "value")]]
[["setData".trim(this, 2, "columnName", fromWidget)]] // Not Working

Table of Contents