@twobirds/microcomponents/assets/documentation/formvalues.md

Micro Components Organization Class

![logo](./MicroComponents.svg)

# Form Values

This module provides a way to bind form input elements (text, radio, checkbox, select, textarea) to a JavaScript object, enabling two-way data binding and change observation.

## formValues Function
Binds form elements to a target object:
```ts
formValues(targetObject: LooseObject, propertyName: string, dom: HTMLElement | ShadowRoot)
```

Example code in constructor
```ts
    constructor(target: HTMLElement) {
        super(target);

        let shadow = (that as DC).target.attachShadow({ mode: 'open' });
        shadow.innerHTML = `<style>${this.css}</style>${this.template}`;

        formValues(that, 'data', shadow); // create this.data formdata observable

    }
```
Full example [here](https://gitlab.com/twoBirds/microcomponents/-/blob/main/src/test/test/testform.ts?ref_type=heads).