1. Guides
  2. Partial page updates

Partial page updates

Run a component action and re-render only part of the page.

1. Include the script

Once per page, e.g. in your wrapper:

<wo:script namespace="ng" filename="ng-js.js" />

2. Mark what updates, and what triggers it

<wo:AjaxUpdateContainer id="clock">
	<wo:str value="$now" />
</wo:AjaxUpdateContainer>

<wo:AjaxUpdateLink action="$refresh" updateContainerID="clock">Refresh</wo:AjaxUpdateLink>

public LocalTime now() {
	return LocalTime.now();
}

public NGActionResults refresh() {
	return null;
}

Elements

ElementTagKey bindings
AjaxUpdateContaineraucid (required), elementName (default div)
AjaxUpdateLinkaulaction, updateContainerID (several: separate with ;)
AjaxSubmitButtonasbaction, updateContainerID, value. Submits its form.
AjaxObserveFieldaofobserveFieldID, updateContainerID, action, fullSubmit, debounce (ms, default 300)

Forms

<wo:form>
	<wo:textfield value="$name" />
	<wo:AjaxSubmitButton action="$greet" updateContainerID="greeting" value="Say hello" />
</wo:form>

<wo:AjaxUpdateContainer id="greeting">Hello <wo:str value="$name" /></wo:AjaxUpdateContainer>

Re-renders also run through the page cache, which keeps the latest render of each container.