FormAPI + Drupal 8 Form and AJAX Mikhail Kraynuk Mikhail Kraynuk - PowerPoint PPT Presentation

FormAPI + Drupal 8 Form and AJAX Mikhail Kraynuk

Mikhail Kraynuk Drupal Senior Developer About my experience in Drupal development ● Development ● Project management ● Drupal audit ● Drupal Localization

Mikhail Kraynuk Drupal Senior Developer Form API Drupal 8 Object-oriented programming Class function use namespase extends OK

Mikhail Kraynuk Drupal Senior Developer New Form <?php ¡ ¡ /** ¡ ¡ * ¡@file ¡ ¡ * ¡Contains ¡\Drupal\Example\Form\ExampleForm. ¡ ¡ */ ¡ ¡ ¡ namespace ¡Drupal\example\Form; ¡ ¡ use ¡Drupal\Core\Form\FormBase; ¡ ¡ use ¡Drupal\Core\Form\FormStateInterface; ¡ ¡ ¡ /** ¡ ¡ * ¡Provides ¡a ¡simple ¡example ¡form. ¡ ¡ public function getFormID () */ ¡ ¡ class ¡ExampleForm ¡extends ¡FormBase ¡{ ¡ public function buildForm ($form, $form_state) ¡ ¡ public function validateForm (&$form, $form_state) } ¡ public function submitForm (&$form, &$form_state)

Mikhail Kraynuk Drupal Senior Developer Form ID /** ¡ ¡ ¡* ¡Implements ¡\Drupal\Core\Form\FormInterface::getFormID(). ¡ ¡ ¡*/ ¡ public ¡function ¡getFormID() ¡{ ¡ ¡ ¡ ¡return ¡’ my_special_form ’; ¡ } ¡ ¡ /** ¡ ¡ ¡* ¡Form ¡builder ¡for ¡my ¡form. ¡ ¡ Drupal 7 ¡*/ ¡ function ¡ my_special_form ($form, ¡&$form_state) ¡{…}

Mikhail Kraynuk Drupal Senior Developer Form builder /** ¡ ¡ ¡* ¡Implements ¡\Drupal\Core\Form\FormInterface::buildForm(). ¡ ¡ ¡*/ ¡ public ¡function ¡buildForm(array ¡$form, ¡FormStateInterface ¡$form_state, ¡$a ¡= ¡0) ¡{ ¡ ¡ ¡ ¡ ¡$form['my_text_field'] ¡= ¡array( ¡ ¡ ¡ ¡ ¡'#type' ¡=> ¡'textfield', ¡ ¡ ¡ ¡ ¡'#title' ¡=> ¡'Example', ¡ ¡ ¡); ¡ ¡ ¡ ¡return ¡$form; ¡ ¡ } ¡ ¡

Mikhail Kraynuk Drupal Senior Developer Form validate /** ¡ ¡ ¡* ¡Implements ¡\Drupal\Core\Form\FormInterface::validateForm(). ¡ ¡ ¡*/ ¡ public ¡function ¡validateForm(array ¡&$form, ¡FormStateInterface ¡$form_state) ¡{ ¡ ¡ ¡ if (strlen($form_state-­‑>getValue( 'phone_number' )) < 3 ) { $form_state-­‑>setErrorByName( 'phone_number', $this-­‑>t( 'The phone number is too short.' )) ; } ¡ } ¡ ¡

Mikhail Kraynuk Drupal Senior Developer Form submit /** ¡ ¡ ¡* ¡Implements ¡\Drupal\Core\Form\FormInterface::submitForm(). ¡ ¡ ¡*/ ¡ public ¡function ¡submitForm(array ¡&$form, ¡FormStateInterface ¡$form_state) ¡{ ¡ ¡ ¡ ¡ ¡$phone ¡= ¡$form_state-­‑>getValue('phone_number'); ¡ ¡ } ¡ ¡ ¡

Mikhail Kraynuk Drupal Senior Developer Get form $form ¡= ¡\Drupal::formBuilder()-­‑>getForm('Drupal\Example\Form\ExampleForm'); ¡ ¡ ¡ ¡ ¡ $form ¡= ¡\Drupal::formBuilder()-­‑>getForm('Drupal\Example\Form\ExampleForm', ¡'test'); ¡

Mikhail Kraynuk Drupal Senior Developer Special forms

Mikhail Kraynuk Drupal Senior Developer Settings form Drupal 7 system_settings_form() use ¡Drupal\Core\Form\FormBase; ¡ use ¡Drupal\Core\Form \ ConfigFormBase ; ¡ ¡ class ¡ExampleConfigForm ¡extends ¡ ConfigFormBase ¡{ ¡ ¡ ... ¡ ¡ ¡public ¡function ¡buildForm(array ¡$form, ¡FormStateInterface ¡$form_state) ¡{ ¡ ¡ ¡ ¡ ¡ ¡$form ¡= ¡parent::buildForm($form, ¡$form_state); ¡ ¡ ¡ ¡ ¡ ¡... ¡ ¡ ¡ ¡ ¡return ¡$form; ¡ ¡ ¡ ¡} ¡ ¡ ... ¡ } ¡

Mikhail Kraynuk Drupal Senior Developer Confirm form Drupal 7 confirm_form() use ¡Drupal\Core\Form\FormBase; ¡ use ¡Drupal\Core\Form\ ConfirmFormBase ; ¡ ¡ class ¡ExampleConfigForm ¡extends ¡ ConfirmFormBase ¡{ ¡ ¡ ... ¡ ¡ ¡public ¡function ¡buildForm(array ¡$form, ¡FormStateInterface ¡$form_state) ¡{ ¡ ¡ ¡ ¡ ¡ ¡$form ¡= ¡parent::buildForm($form, ¡$form_state); ¡ ¡ ¡ ¡ ¡ ¡... ¡ ¡ ¡ ¡ ¡return ¡$form; ¡ ¡ ¡ ¡} ¡ ¡ ... ¡ }

Mikhail Kraynuk Drupal Senior Developer AJAX

Mikhail Kraynuk Drupal Senior Developer AJAX AJAX OK AJAX commands OK

Mikhail Kraynuk Drupal Senior Developer 1. Add Ajax namespace <?php ¡ ¡ /** ¡ ¡ * ¡@file ¡ ¡ * ¡Contains ¡\Drupal\Example\Form\ExampleForm. ¡ ¡ */ ¡ ¡ ¡ namespace ¡Drupal\example\Form; ¡ ¡ use ¡Drupal\Core\Form\FormBase; ¡ use ¡Drupal\Core\Form\FormStateInterface; ¡ ¡ ¡ use ¡Drupal\Core\Ajax\AjaxResponse; ¡ ¡ use ¡Drupal\Core\Ajax\HtmlCommand; ¡ ¡ ¡ /** ¡ ¡ * ¡Provides ¡a ¡simple ¡example ¡form. ¡ ¡ */ ¡ ¡ class ¡ExampleForm ¡extends ¡FormBase ¡{ ¡... ¡} ¡

Mikhail Kraynuk Drupal Senior Developer 2. Add Ajax-callback /** ¡ ¡ * ¡Provides ¡a ¡simple ¡example ¡form. ¡ ¡ */ ¡ ¡ class ¡ExampleForm ¡extends ¡FormBase ¡{ ¡ ¡ ¡ ¡public ¡function ¡getFormID() ¡ ¡ ¡public ¡function ¡buildForm(array ¡$form, ¡FormStateInterface ¡$form_state) ¡ ¡ ¡public ¡function ¡ validateForm (array ¡&$form, ¡FormStateInterface ¡$form_state) ¡ ¡ ¡public ¡function ¡submitForm(array ¡&$form, ¡FormStateInterface ¡$form_state) ¡ ¡ ¡ ¡public ¡function ¡ validateAjaxPhone (array ¡&$form, ¡FormStateInterface ¡$form_state) ¡ } ¡

Mikhail Kraynuk Drupal Senior Developer 3. Update field public ¡function ¡buildForm(array ¡$form, ¡FormStateInterface ¡$form_state) ¡{ ¡ ¡ ¡ ¡... ¡ ¡ ¡$form['my_phone'] ¡= ¡array( ¡ ¡ ¡ ¡ ¡'#type' ¡=> ¡'tel', ¡ ¡ ¡ ¡ ¡'#title' ¡=> ¡$this-­‑>t(' Phone number' ), ¡ ¡ ¡ ¡ ¡'#description' ¡=> ¡$this-­‑>t(' Enter your phone number with “+”. '), ¡ ¡ ¡ ¡ ¡'#ajax' ¡=> ¡array( ¡ ¡ ¡ ¡ ¡ ¡ ¡'callback' ¡=> ¡array($this, ¡' validateAjaxPhone '), ¡ ¡ ¡ ¡ ¡ ¡ ¡'event' ¡=> ¡'change', ¡ ¡ ¡ ¡ ¡ ¡ ¡'progress' ¡=> ¡array( ¡ ¡ ¡ ¡ ¡ ¡ ¡ ¡ ¡'type' ¡=> ¡'throbber', ¡ ¡ ¡ ¡ ¡ ¡ ¡ ¡ ¡'message' ¡=> ¡$this-­‑>t(' verifying… '), ¡ ¡ ¡ ¡ ¡ ¡ ¡), ¡ ¡ ¡ ¡ ¡), ¡ ¡ ¡ ¡ ¡'#suffix' ¡=> ¡'<span ¡class=“valid-­‑message”></span>', ¡ ¡ ¡); ¡ ¡ ¡return ¡$form; ¡ ¡ } ¡ ¡

Mikhail Kraynuk Drupal Senior Developer 4. Fill Ajax-callback public ¡function ¡validateAjaxPhone(array ¡&$form, ¡FormStateInterface ¡$form_state) ¡{ ¡ ¡ ¡ ¡ ¡$response ¡= ¡new ¡AjaxResponse(); ¡ ¡ ¡ ¡ ¡ ¡if (substr($form_state-­‑>getValue( 'my_phone' ), ¡ 0 , ¡ 1 ) == '+' ) { ¡ ¡ ¡ ¡ ¡$message ¡= ¡$this-­‑>t(' Phone number is correct' ); ¡ ¡ ¡} ¡ ¡ ¡else { ¡ ¡ ¡ ¡ ¡$message ¡= ¡$this-­‑>t(' Please start your phone number with “+”' ); ¡ ¡ ¡} ¡ ¡ ¡ ¡$response-­‑>addCommand(new ¡HtmlCommand( '. valid-­‑message ' , ¡$message)); ¡ ¡ ¡ ¡return ¡$response; ¡ ¡ } ¡ ¡

Mikhail Kraynuk Drupal Senior Developer Ajax result

Mikhail Kraynuk Drupal Senior Developer Ajax result

Mikhail Kraynuk Drupal Senior Developer Спасибо ! Mikhail Kraynuk kraynuk.m@i20.biz +7 961 870-26-99 Drupal Senior developer При поддержке : Золотой спонсор : Серебряный спонсор :