htmx-jsonata

htmx extension that provides jsonata query functionality for htmx elements

``html



`

attributes

- jn-url (required): the url to fetch data from.
- jn-query: jsonata expression to filter and transform the data
- jn-each: marks an element as a template to be cloned for each item in an array response.

templating

use ${...} syntax to reference data properties directly:

`html


properties support dot notation: ${user.address.city}

to reference an array as the root, insert the index: ${[0].username}

example

`html
jn-url="https://status.powerschool.com/api/v2/summary.json"
jn-query="
components.(
$ConvertDate := function($date) {
$toMillis($date) ~> $fromMillis('[M]/[D]/[Y]')
};

{
'name': name,
'status': status,
'updated': $ConvertDate(updated_at)
}
)
"
>


• 
  

  
  ${name}
  ${status}
  
  
  (last updated: ${updated})