# HTML

This document explains the HTML markup used by QFQ.

## Hooks

Hooks are used on the Client to gather information required for
asynchronous requests and to add predefined event handlers to HTML Elements.


### form.data-toggle="validator"

Adding the attribute `data-toggle="validator"` to a `<form>` element,
enables the Bootstrap Validator on that HTML Form.


### .data-sip

Asynchronous requests require to pass a SID to the Server. Elements
triggering an asynchronous request, may gather the SIP from the
`data-sip` attribute assigned to the HTML Form Element.


### .class="record-delete"

HTML Form Buttons having the class `record-delete` set, will get an
`onclick` handler attached by `QfqNS.QfqRecordList`. Each `<button>`
also requires an `data-sip` attribute.


### .data-load=""

HTML Form Elements having the attribute `data-load`, will trigger a
call to `api/load.php` upon change.

### id="save-button"
### id="close-button"
### id="delete-button"
### id="form-new-button"

## Typeahead

Typeahead capable text input elements will be defined by the following attributes:
 
### .class='qfq-typeahead'

### .data-typeahead-sip

The SIP will store: 

Use with SQL: `typeAheadSql`

Use with LDAP: `typeAheadLdap`
* `ldapServer`
* `ldapBaseDn`
* `typeAheadLdapSearch`
* `typeAheadLdapValuePrintf`
* `typeAheadLdapKeyPrintf`
 
### .data-typeahead-limit

* Defines the limit of entries shown on the client. Default on client is 5. The server will always send a value. The server default is 20.

### .data-typeahead-minlength

* Defines the string minlegth, typed by the user, before the first lookup is started. Default is 2.