jsontree — u_pbt_jsontree #

← Component reference · Guide contents

jsontree shows a JSON value as a collapsible tree, coloured by type: a config screen, an API response, an integration debug. You set the JSON text in is_json, the component shows it; a click on a node reports its path (ue_node_clicked), invalid JSON raises ue_error. It changes nothing: it is a VIEWER.

▶ See it live — Demo application, JSON tree tile, with the code and this page side by side.

At a glance #

Quick start #

// Show an API response as a tree
uo_json.is_json = inv_rest.of_response_text()

// Fold everything, then let the user open what interests them
uo_json.of_collapse_all()

// ue_node_clicked : the dotted path of the node clicked ("lines.0.sku")
// -> read it in your own data with what the path names

Properties #

Methods #

Events #

Example #

Explore an API response #

if inv_rest.of_get("https://api.example.com/orders/4152") = 200 then
	uo_json.is_json = inv_rest.of_response_text()
	uo_json.of_collapse_all()          // the reader opens what interests them
else
	uo_json.of_clear()
end if

Good practice #

• It is a viewer, not an editor: it shows the JSON, it does not change it. To read a value, take the path from ue_node_clicked and fetch it in your own data.
• A large JSON folds: of_collapse_all first, the reader opens what interests them — a thousand nodes open at once is unreadable.
• Invalid JSON breaks nothing: ue_error says so, the tree stays empty. That is the feedback to show, not a crash.

Inherited from the common base #

These members exist on every visual component — they are not specific to this one. They are detailed once, in the transverse chapters; this table only says where to read them.

← Component reference · Guide contents