I’m trying to ajaxify part of node form. I have a hook_form_alter that adds extra ajax property to a widget of select field. The problem I’m facing is the callback method / function, which is not fired when change is happening.
So this is my form_alter code which resides in accountancy_invoice/accountancy_invoice.module:
function accountancy_invoice_form_node_form_alter(array &$form, DrupalCoreFormFormStateInterface $form_state, $form_id) { if ($form_id == 'node_invoice_form') { $form['accommodation'] = array( '#type' => 'container', '#prefix' => '<div id="user-full-name">Dave</div>', '#attributes' => array( 'class' => 'user-full-name', ), ); $form['field_invoice_customer']['widget']['#ajax'] = array( 'callback' => 'Drupalaccountancy_invoiceFormAjaxifyForm::customerValues', 'progress' => array( 'type' => 'throbber', 'message' => NULL, ) ); } }
This is my AjaxifyForm class which resides in accountancy_invoice/src/Form/AjaxifyForm.php:
namespace Drupalaccountancy_invoiceForm; use DrupalCoreFormFormBase; use DrupalCoreFormFormStateInterface; use DrupalCoreAjaxAjaxResponse; use DrupalCoreAjaxHtmlCommand; use DrupalCoreAjaxReplaceCommand; use DrupalCoreAjaxOpenModalDialogCommand; class AjaxifyForm { public static function customerValues(array &$form, DrupalCoreFormFormStateInterface $form_state) { $response = new AjaxResponse(); $response->addCommand(new ReplaceCommand('#user-full-name', '<span class="unit">Bryan</span>')); $title = "Example Dialog"; $content = "foo bar content"; $options = array(); $response->addCommand(new OpenModalDialogCommand($title, $content, $options)); return $response; } }
It doesn’t really matter at the moment what this ajax should do. For testing purposes I just want to change name from Dave to Bryan in #user-full-name and display sample dialog box.
In the console, each time ajax is triggered I got an error:
This is complete error message (it’s trimmed in the screenshot): ↵An AJAX HTTP error occurred.↵HTTP Result Code: 200↵Debugging information follows.↵Path: /node/add/invoice?ajax_form=1↵StatusText: OK↵ResponseText: TypeError: Argument 1 passed to DrupalCoreFormFormState::setError() must be of the type array, null given, called in /var/www/drupalvm/drupal/web/core/lib/Drupal/Core/Field/WidgetBase.php on line 441 in DrupalCoreFormFormState->setError() (line 1093 of /var/www/drupalvm/drupal/web/core/lib/Drupal/Core/Form/FormState.php).