https://github.com/heimrichhannot/contao-form-autocomplete-bundle

https://github.com/heimrichhannot/contao-form-autocomplete-bundle

Last synced: about 1 month ago
JSON representation

• Host: GitHub
• URL: https://github.com/heimrichhannot/contao-form-autocomplete-bundle
• Owner: heimrichhannot
• Created: 2020-09-01T10:04:47.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2024-05-21T12:35:57.000Z (7 months ago)
• Last Synced: 2024-11-09T02:47:45.878Z (about 2 months ago)
• Language: PHP
• Size: 18.6 KB
• Stars: 0
• Watchers: 5
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        
# Contao Form Autocomplete Bundle

This bundle offers functionality for adding the HTML5 attribute `autocomplete` to form fields in the Contao CMS.

The `autocomplete` attribute is used in the following cases:

1. Browsers use it for presenting different autocompletion options for fields wth different `autocomplete` value set.

1. Screen readers verbalize it, hence it's a good practice to have them set.

## Features

- adds the HTML5 `autocomplete` attribute to form fields

- supports:

  - Contao Formgenerator

  - all form fields generated by using Widget::parse() (the hook getAttributesFromDca is used)

## Installation

1. Install via composer: `composer require heimrichhannot/contao-form-autocomplete-bundle`.

## How does it work?

### Form generator

The form generator is supported by default. The `autocomplete` value is guessed based on the field name. 

The value is guessed based on the mapping defined in the bundle config. You can extend this mapping in your project (see chapter below).

### Dca fields

There are the following supported ways to add the `autocomplete` value to a field (the priority is descending):

1. The DCA definition has it set in its `eval` section:

    ```

    // tl_my_table.php

    'myFirstnameField' => [

       'label' => &$GLOBALS['TL_LANG']['tl_my_table']['myFirstnameField'],

       // ...

       'eval' => [

           'autocomplete' => 'given-name'

       ]

    ]

    ```

1. If no DCA definition is found or relevant in the given context (e.g. in form generator there is no DCA context), the bundle tries to guess based on the mapping

   of field name to `autocomplete` value defined in this bundle. You can extend this mapping in your project (see chapter below).

## Technical details

### Extend the given mapping

Simply add the following code according to your needs to your `app/config/config.yml` (Contao 4.4) or `config/config.yml`:

```yaml

huh_form_autocomplete:

  mapping:

    given-name:

      synonyms:

        - my-new-value

    new-autocomplete-name:

      synonyms:

        - brand-new-autocomplete-name

```

### How does the matching of a field name and an autocomplete value work?

The algorithm is currently very simple. Basically it works the following way:

1. If an `autocomplete` value is set in the field's DCA, it's used.

1. The mapping in `src/Resources/config/config.yml` contains all the currently possible values of the HTML5 `autocomplete` field. If the field name equals one of these, it's used.

1. If the step before isn't met, the algorithm iterates the defined synonyms of the `autocomplete` values. If there's a match, the corresponding `autocomplete` value is used.

1. If none of the steps above is met, `false` is returned.

The comparison only takes into account characters. Special characters and separation characters like `-` or `_` are ignored. Hence a synonym `some-name` equals `someName` in

this comparison.