Creazione di un Custom Form con Autocompletamento in Drupal 10

In Drupal 10, la creazione di un form personalizzato con un campo di autocompletamento che interagisce con una route AJAX può sembrare complessa, ma seguendo questi passaggi, puoi implementare facilmente questa funzionalità.

1. Creazione del Form

Per iniziare, crea un modulo personalizzato (se non ne hai già uno). All'interno del tuo modulo, crea un file PHP per il form.

Supponiamo che il file si chiami MyCustomForm.php.

Qui definirai la struttura del tuo form.

namespace Drupal\mio_modulo\Form;

use Drupal\Core\Form\FormBase;
use Drupal\Core\Form\FormStateInterface;

class MyCustomForm extends FormBase {

  public function getFormId() {
    return 'mio_custom_form';
  }

  public function buildForm(array $form, FormStateInterface $form_state) {
    $form['mio_campo_autocomplete'] = [
      '#type' => 'textfield',
      '#title' => $this->t('Mio Campo Autocompletamento'),
      '#autocomplete_route_name' => 'mio_modulo.autocomplete',
      '#autocomplete_route_parameters' => [], // Parametri aggiuntivi se necessari( ne par)
    ];

    // Aggiungi altri campi e sottometti qui.

    return $form;
  }

  public function submitForm(array &$form, FormStateInterface $form_state) {
    // Gestione del submit.
  }
}
        

2. Definizione della Route per l'Autocompletamento

Dopo aver creato il campo di autocompletamento, è necessario definire una route per gestire la richiesta AJAX.

Nel file mio_modulo.routing.yml del tuo modulo, aggiungi:

mio_modulo.autocomplete:
  path: '/mio-modulo/autocomplete'
  defaults:
    _controller: '\Drupal\mio_modulo\Controller\AutocompleteController::handleAutocomplete'
  requirements:
    _permission: 'access content'
        

3. Creazione del Controller per l'Autocompletamento

Crea un controller che gestirà la logica dell'autocompletamento.

Nel file AutocompleteController.php:

namespace Drupal\mio_modulo\Controller;

use Drupal\Core\Controller\ControllerBase;
use Symfony\Component\HttpFoundation\JsonResponse;
use Symfony\Component\HttpFoundation\Request;

class AutocompleteController extends ControllerBase {

  public function handleAutocomplete(Request $request) {
    $matches = [];
    $input = $request->query->get('q');

    if ($input) {
      // Qui implementi la logica per trovare le corrispondenze.
      // Per esempio:
      $matches[] = ['value' => $input . ' 1', 'label' => $input . ' 1'];
      $matches[] = ['value' => $input . ' 2', 'label' => $input . ' 2'];
    }

    return new JsonResponse($matches);
  }
}
        

Considerazioni Finali

• Sicurezza e Validazione: Assicurati di validare e sanificare gli input dell'utente per prevenire vulnerabilità.
• Performance: Se il dataset per l'autocompletamento è significativo, considera l'ottimizzazione delle query o l'utilizzo di tecniche di caching.
• User Experience: Assicurati che il campo di autocompletamento sia intuitivo e fornisca feedback visivo efficace.

Con questi passaggi, avrai creato un form personalizzato in Drupal 10 con un campo di autocompletamento avanzato, offrendo un'esperienza utente dinamica e interattiva.

Leggio su MEDIUM (migliore visualizzazione del codice)