{partdiv:name:vars:content}

Description

partdiv wraps a region of a page in a div that AA can repaint on its own when the data behind it changes. You give the part a unique name, list the slices and query-string variables it depends on, and the content to show. When a visitor edits one of those slices in place, or a listed query-string variable changes, AA re-renders just this part and swaps it into the page without a full reload - the div carries the class aa-partdiv plus the name and a data-aa-part hash that the editor JavaScript targets. The dependency hash is built from the name and the vars only, so two parts that share a name and vars share a hash. If name is empty, partdiv does nothing and returns the content unchanged, so the live-update feature is simply switched off. One trap: a colon inside content is read as a parameter separator and truncates the content, so write a literal colon as #: (for example Total#: 3).

Parameters

name optional

Unique name for this page part on the page. It becomes part of the div class (aa-partdiv NAME) and, with vars, of the data-aa-part hash the editor JavaScript targets. If left empty, partdiv is inactive and returns content unchanged.

vars optional

JSON array of slice ids and query-string variable names this part depends on, for example ["9e1d2b9f...","q"]. When any listed slice is edited in place or any listed query-string variable changes, AA repaints just this part. The hash is built from name and vars, so this also defines the part identity. Empty means no dependencies (the part is wrapped but never auto-repainted).

content optional

The HTML or template content to place inside the part div (and to return as-is when name is empty). A colon inside content is read as a parameter separator and truncates it, so write a literal colon as #: (Total#: 3).

Examples

virtual{partdiv:status::Online}
Expected
Online
Online
">Actual
Online
A named part with empty vars. partdiv wraps content in a div carrying the class aa-partdiv plus the name, and a data-aa-part hash. With no vars listed nothing triggers an auto-repaint, but the part is addressable by name. Output is HTML markup, so this is illustrative, not asserted.
virtual{partdiv:list:["9e1d2b9f88e3d6c3bf0eb967378610d6","q"]:Results}
Expected
Results
Results
">Actual
Results
vars can mix slice ids with query-string variable names. Here the part repaints when the Stable slice is edited or when the q query-string variable changes - useful for a search result region that follows a ?q= filter. Output is markup, so this is illustrative.
test{partdiv:::a#:b}
Expecteda:b
Actuala:b
A colon inside content is otherwise read as a parameter separator and would cut content short. Writing it as #: keeps the literal colon. Here name is empty so the content a#:b is returned as a:b.
test{partdiv::["news"]:Hello}
ExpectedHello
ActualHello
With an empty name, partdiv adds no wrapper and no dependency tracking - it just returns content. The vars and content are still parsed, so this is the off switch for the live-update feature.
virtual{partdiv:cart:["9e1d2b9f88e3d6c3bf0eb967378610d6"]:Items here}
Expected
Items here
Items here
">Actual
Items here
vars lists the slice id this part depends on. When an item in that slice is edited in place, AA re-renders just this part and swaps it into the page. The data-aa-part hash is derived from the name and vars. Output is markup, so this is illustrative.
virtual{partdiv:cart:["news"]:Total#: 3 items}
Expected
Total: 3 items
Total: 3 items
">Actual
Total: 3 items
Without the escape, content Total: 3 items would be cut to Total (the colon starts a fourth parameter that partdiv ignores). Writing Total#: 3 items keeps the colon. Output is markup, so this is illustrative.