Formlarınızı Canlandırın: Drupal'ın Form API'si ile Kullanıcı Deneyimini Geliştirme

"Form yorgunluğunun" bir şey olduğunu biliyor muydunuz?! Çok fazla form doldurmanız gerektiğinde bu bir yorgunluk hissidir. Ancak formlar bir web sitesinin ayrılmaz bir parçasıdır ve hiçbir site sahibi onlarsız yapamaz (veya yapmamalıdır). Peki, web sitenizin form yorgunluğunu azaltmaya yardımcı olduğundan nasıl emin olabilirsiniz? Kolay! Basit ve kısa tutun, net ve özlü talimatlar verin, uzun formları bölün ve otomatik doldurmayı kullanın. Hepsinden önemlisi, bunları doldurmak için canlı bir kullanıcı deneyimi sunduğunuzdan emin olun.

Drupal'ın Form API'si, herhangi bir web sitesiyle iyi uyum sağlamak için kolayca özelleştirilebilir ve temalı formlar oluşturmanın bir yolunu sunar. Geliştiricilere Drupal'da formlar oluşturmak, doğrulamak ve işlemek için bir dizi işlev ve API sağlar. Harika Drupal Form API'sine daha derin bir dalış yapın ve onu bir sonraki projenizde nasıl uygulayabileceğinizi öğrenin.

Neden Form API'sı

Bildiğiniz gibi formlar, kullanıcıların veri göndererek onlarla etkileşim kurmasına izin verdiği için her web sitesinin çok önemli bir parçasıdır. Geliştiriciler, Drupal'ın Form API'sini kullanarak iletişim, oturum açma ve kayıt dahil olmak üzere çeşitli amaçlar için benzersiz formlar oluşturabilir. Form API'yi düşünmeniz için birkaç neden:

1. Kullanımı kolaydır ve çok fazla kodlama deneyimi gerektirmez. Bir dizi basit ve sezgisel işlevi kullanarak formlar oluşturabilirsiniz.
2. Form verilerini kolayca doğrulamanıza izin veren yerleşik doğrulama işlevleri sağlar.
3. Siteler arası komut dosyası çalıştırma (XSS) ve siteler arası istek sahteciliği (CSRF) gibi saldırıları önlemeye yardımcı olan yerleşik güvenlik özellikleriyle birlikte gelir.
4. Son derece özelleştirilebilir ve birden çok alan, düğme ve eylem içeren karmaşık formlar oluşturmak için kullanılabilir.
5. Form API'leri temalanabilir olduğundan geliştiriciler, formlarının istedikleri gibi görünmesini sağlamak için CSS ve HTML'yi değiştirebilirler.
6. Diğer Drupal API'leri ile kolayca entegre edilebilir.

Form oluşturmadan önce bilmeniz gerekenler

Drupal'da sıklıkla kullanılan çeşitli biçimler vardır. Her biri, kendi tasarımınız olan benzersiz bir modülde genişletebileceğiniz bir temel sınıf içerir.

Öncelikle, oluşturmanız gereken form türünü belirleyin:

• Genel bir biçim. FormBase'i genişletin.
• Yöneticilerin bir modülün ayarlarını güncellemesini sağlayan bir konfigürasyon formu. ConfigFormBase'i genişletin.

FormBase, FormInterface'i uyguladığından, hiyerarşisinde FormBase bulunan herhangi bir formun aşağıdaki yöntemleri uygulaması gerekir.

• getFormId()
• buildForm()
• Formu gönder()

Form API ile genel bir özel form oluşturmak için buildForm() içinde bir dizi form öğesi döndüren bir işlev tanımlamanız gerekir. Her öğenin anahtarı, form öğesinin adıdır ve değer, öğeyi tanımlayan bir özellikler dizisidir. Örneğin, bir metin alanı oluşturmak için şöyle bir öğe tanımlarsınız:

 $form['emp_name'] = [ '#type' => 'textfield', '#title' => $this->t('Enter Name'), '#required' => TRUE, ];

Doğrulama ekleniyor

Form API ayrıca kullanıcı girişini doğrulamak için bir yol sağlar. Form tanımınıza, form gönderildiğinde çağrılacak doğrulama işlevleri ekleyebilirsiniz. Bir doğrulama işlevi bir hata mesajı verirse, form gönderimi engellenir ve hata mesajı kullanıcıya gösterilir.

Bir doğrulama işlevi eklemek için bir valideForm() uygulamanız gerekir.

Form gönderimleri işleniyor

Bir form gönderildiğinde, Drupal sizin tanımladığınız bir gönderme işlevini çağırır. Gönderme işlevi, form verilerinin veri tabanına kaydedilmesi gibi gerekli tüm işlemleri gerçekleştirebilir.

Bir gönderim işlevi tanımlamak için birsubmitForm() uygulamanız gerekir.

Formu bir istekle entegre edin

Bu formu bir Drupal sitesinin URI yapısına entegre etmek için aşağıdakine benzer bir yol kullanın:

 example.form: path: '/example-form' defaults: _title: 'Example form' _form: '\Drupal\example\Form\ExampleForm' requirements: _permission: 'access content'

_form anahtarı, yönlendirme sistemine, sağlanan sınıf adının, bir form olarak örneklenecek ve işlenecek bir form sınıfı olduğunu söyler.

Drupal Form API ile özel bir form oluşturma

Drupal'ın Form API'si ile özel bir form oluşturma sürecine başlamak için şu kolay adımı izleyin:

1. Özel bir modül içinde bir .info.yml oluşturun. ( Özel formlar için ayrı bir modül oluşturduğumuz için, mevcut bir modüle form eklemek için bu adım gerekli değildir ).
2. Form dizisini döndürmek için bir form sınıfı oluşturun. (custom_module/src/Form/Registration.php )
3. Bir .routing.yml dosyası oluşturun
4. Formu değiştirmek için bir .module ve hook_form_alter() ve/veya hook_form_FORM_ID_alter() oluşturun ( Gerekirse ).

Çalışan kayıt formunun eksiksiz bir örneğini burada bulabilirsiniz:

Klasör yapısı:

1. çalışan_kayıt.info.yml

 name: Employee Registration Form type: module description: Custom module for implementing custom employee registration form. core_version_requirement: ^9 || ^10 package: Custom

2. src/Form/Registration.php

 <?php namespace Drupal\employee_registration\Form; use Drupal\Core\Form\FormBase; use Drupal\Core\Form\FormStateInterface; /** * Implements a custom form. */ class Registration extends FormBase { /** * {@inheritdoc} */ public function getFormId() { return 'employee_registration_form'; } /** * {@inheritdoc} */ public function buildForm(array $form, FormStateInterface $form_state) { $form['emp_name'] = [ '#type' => 'textfield', '#title' => $this->t('Enter Name'), '#required' => TRUE, ]; $form['emp_no'] = [ '#type' => 'textfield', '#title' => $this->t('Enter Employee Number'), '#required' => TRUE, ]; $form['emp_mail'] = [ '#type' => 'email', '#title' => $this->t('Enter Email ID'), '#required' => TRUE, ]; $form['emp_phone'] = [ '#type' => 'tel', '#title' => $this->t('Enter Contact Number'), ]; $form['emp_dob'] = [ '#type' => 'date', '#title' => $this->t('Enter DOB'), '#required' => TRUE, ]; $form['emp_gender'] = [ '#type' => 'select', '#title' => $this->t('Select Gender'), '#options' => [ 'Male' => $this->t('Male'), 'Female' => $this->t('Female'), 'Other' => $this->t('Other'), ], ]; $form['submit'] = [ '#type' => 'submit', '#value' => $this->t('Save'), '#button_type' => 'primary', ]; return $form; } /** * {@inheritdoc} */ public function validateForm(array &$form, FormStateInterface $form_state) { if (strlen($form_state->getValue('emp_phone')) < 10) { $form_state->setErrorByName('emp_phone', $this->t('The phone number is too short. Please enter a full phone number.')); } } /** * {@inheritdoc} */ public function submitForm(array &$form, FormStateInterface $form_state) { // Processing form data. $this->messenger()->addMessage($this->t("Employee Registration Done!!")); foreach ($form_state->getValues() as $key => $value) { $this->messenger()->addMessage($key . ': ' . $value); } } }

3. çalışan_kayıt.yönlendirme.yml

 employee_registration.form: path: '/registration-form' defaults: _title: 'Employee Registration' _form: '\Drupal\employee_registration\Form\Registration' requirements: _permission: 'access content'

Sonuç:

Son düşünceler

Form API, Drupal'da doğrulama ve işleme işlevleriyle karmaşık ve özelleştirilmiş formlar oluşturmanıza olanak tanır. Form API'yi kullandığınızda, formlarınızın kullanıcılarınız için tutarlı ve kullanımının kolay olduğundan emin olabilirsiniz. Kitleniz için kullanıcı dostu bir deneyim oluşturmanıza yardımcı olacak bir Drupal ajansı mı arıyorsunuz? Drupal uzmanlarımızla bugün konuşun!