# About SA5's Data Lib

**SA5 Data** is a versatile framework that allows you to connect pieces of data to elements in your webpage. 

It supports simple no-code data-binding like;

* Initialize a form input from a querystring param 
* Populate an option element from a collection list 
* Capture the current page URL, path, or UTM params into hidden form fields as part of your form submission  

## Goals

Make data sources nocode accessible in Webflow page designs including; 

* CMS data 
* Querystring data
* URL, path, and hash data 

Bind these easily to; 

* Element text content
* Form elements 
* Form hidden fields for data capture  

{% hint style="info" %}
**Inbound-only.** Our data & data-binding features are one-way. They're designed to integrate information into your site from various sources - but not to update external data stores. If you are looking for round-trip capabilities, it's likely you need an application platform like Wized + Xano. 
{% endhint %}

## Concepts 

SA5's Data features have two facets- 

* **Data Sources** refer to the ability to assemble, store, and retrieve data from Collection Lists, remote sources, the querystring, webStorage, cookies, and more. The data is collected and organized into a Datastore. 
* **Data-Bound Elements** uses these sources to pull data into your page, text element, rich text templates, form fields, and more. It lets you easily display data from these sources using simple markup. 

Data Sources include;

* Collection-lists, which are prepared to allow 
* Arbitrary, static data-sets
* Query string params
* The current URL & URL parts
* LocalStorage items
* SessionStorage items
* Cookies

Data Binding can be applied to;

* Any text element 
* Rich text elements, to `{{ expand }}` macro content 
* Form input fields, specifically
  * Text fields, to set the current text input
  * Textarea fields, to set the current text input
  * Checkboxes, to set the checked/unchecked state
  * Select fields, to select the current item  

{% hint style="success" %}
The **Data Source** & **Data Binding** portions of Sygnal Attributes comprise probably the largest and most complex part of this library. They're used by themselves, but are also relied on by our other libraries. We'll be migrating and adding new capabilities as we go.   
{% endhint %}

## Capabilities 

Here are some of the things SA5 Data can do; 

* Populate form fields from querystring params ( see [demo](https://data-binding.webflow.io/query?code=ID6079\&name=Trial+User+1\&color=blue\&accept=true) )
* Populate form fields to include the current URL or path ( see [demo](https://data-binding.webflow.io/url) )
* Populate form fields from webStorage or cookies, as part of a referral tracking system ( see [demo](https://data-binding.webflow.io/webstorage) )
* Populate form fields with current user data, such as the user's email & name
* Perform "mad libs" style text replacements in rich text content, mixed from Collection List fields and other sources ( see [demo](https://data-binding.webflow.io/cms) ) 

## Use Cases

Some common use cases we see often; 

* Initialize form fields with data from query string params
* Track what page or collection item a form is submitted from
* Capture referral tracking codes from cookies, or webStorage, when a user signs up for a Membership  
* Display stored data like the currently logged in user's name or email 
* Expand template `{{ macros }}` in rich text to create dynamic content. 
* Extract CMS data and use it to perform special calculations or views, like a running total on a balance sheet 

In combination, these can be used to move data easily through your site, and to pass information back to your server in hidden fields as users submit forms. 


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://attr.sygnal.com/sa5-data/about.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.