Created
October 12, 2022 13:12
-
-
Save abelperezlindo/0f4e682806b3d00aaf03e9eebb11f9bd to your computer and use it in GitHub Desktop.
Drupal 8/9/10 Ajax form example when select box changed and multiple options can be selected. Displays a new form element for each selected option.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
namespace Drupal\tester\Form; | |
use Drupal\Core\Form\ConfigFormBase; | |
use Drupal\Core\Form\FormStateInterface; | |
use Drupal\Core\State\State; | |
use Symfony\Component\DependencyInjection\ContainerInterface; | |
use Drupal\Core\Config\ConfigFactoryInterface; | |
use Drupal\Core\Messenger\MessengerInterface; | |
/** | |
* Class for config form. | |
*/ | |
class TesterForm extends ConfigFormBase { | |
/** | |
* For use the Drupal state api. | |
* | |
* @var \Drupal\Core\State\State | |
*/ | |
protected $state; | |
/** | |
* The Messenger service. | |
* | |
* @var \Drupal\Core\Messenger\MessengerInterface | |
*/ | |
protected $messenger; | |
/** | |
* Constructor method. | |
* | |
* @param \Drupal\Core\Config\ConfigFactoryInterface $config_factory | |
* The interface for Config Factory. | |
* @param \Drupal\Core\State\State $state | |
* The object State. | |
* @param \Drupal\Core\Messenger\MessengerInterface $messenger | |
* The messenger object. | |
*/ | |
public function __construct( | |
ConfigFactoryInterface $config_factory, | |
State $state, | |
MessengerInterface $messenger | |
) { | |
parent::__construct($config_factory); | |
$this->state = $state; | |
$this->messenger = $messenger; | |
} | |
/** | |
* {@inheritdoc} | |
*/ | |
public static function create(ContainerInterface $container) { | |
return new static( | |
$container->get('config.factory'), | |
$container->get('state'), | |
$container->get('messenger') | |
); | |
} | |
/** | |
* Get Form Id Method. | |
*/ | |
public function getFormId() { | |
return 'tester_form'; | |
} | |
/** | |
* Get Editable Config Names Method. | |
*/ | |
public function getEditableConfigNames() { | |
return [ | |
'tester.settings', | |
]; | |
} | |
/** | |
* Build Form method. | |
*/ | |
public function buildForm(array $form, FormStateInterface $form_state) { | |
$form['box'] = [ | |
'#type' => 'fieldset', | |
'#title' => '* ___ *', | |
]; | |
// Get the form values and raw input (unvalidated values). | |
$values = $form_state->getValues(); | |
$ajax_wrapper = 'change-by-ajax-box'; | |
$options = [1 => 'Hola', 2 => 'amigos', 3 => 'de', 4 => 'youtube']; | |
$form['box']['selection'] = [ | |
'#type' => 'select', | |
'#title' => 'Seleccionar algo', | |
'#options' => $options, | |
'#multiple' => TRUE, | |
'#ajax' => [ | |
'callback' => [$this, 'mySelectChange'], | |
'event' => 'change', | |
'wrapper' => $ajax_wrapper, | |
], | |
]; | |
$form['box']['change'] = [ | |
'#type' => 'container', | |
'#attributes' => [ | |
'id' => $ajax_wrapper, | |
], | |
]; | |
// ONLY LOADED IN AJAX RESPONSE OR IF FORM STATE VALUES POPULATED. | |
if (!empty($values) && !empty($values['selection'])) { | |
foreach ($values['selection'] as $key => $value) { | |
$form['box']['change'][$key] = [ | |
'#type' => 'select', | |
'#options' => ['si', 'no', 'nose'], | |
'#title' => $options[$key], | |
]; | |
} | |
$form['box']['change']['msg'] = [ | |
'#markup' => 'The current select value is ' . implode(' ', $values['selection']), | |
]; | |
} | |
elseif (isset($form['box']['change']['msg'])) { | |
unset($form['box']['change']['msg']); | |
} | |
$form['#attached']['library'][] = 'tester/tester_lib'; | |
return $form; | |
} | |
/** | |
* Form submit. | |
* | |
* { @inheritDoc } | |
*/ | |
public function submitForm(array &$form, FormStateInterface $form_state) { | |
$lol = 'Un juego malardo'; | |
return parent::submitForm($form, $form_state); | |
} | |
/** | |
* Form validate. | |
* | |
* { @inheritDoc } | |
*/ | |
public function validateForm(array &$form, FormStateInterface $form_state) { | |
} | |
/** | |
* Undocumented function | |
* | |
* @param array $form | |
* @param FormStateInterface $form_state | |
* @return void | |
*/ | |
public function mySelectChange(array &$form, FormStateInterface $form_state) { | |
return $form['box']['change']; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment