Skip to content

Instantly share code, notes, and snippets.

@chandantbs
Created March 10, 2022 06:12
Show Gist options
  • Save chandantbs/11b00903ac74e4b30144fa0cedd2f360 to your computer and use it in GitHub Desktop.
Save chandantbs/11b00903ac74e4b30144fa0cedd2f360 to your computer and use it in GitHub Desktop.
Drupal 9 - Load entity form in modal popup
<?php
/**
* Implements hook_form_alter().
*/
function chandan_form_alter(&$form, FormStateInterface $form_state, $form_id) {
switch ($form_id) {
case 'user_form':
case 'user_profile_form':
chandan_add_ajax_form($form_id, $form);
}
}
/**
* Add Ajax handler.
*/
function chandan_add_ajax_form($form_id, &$form) {
$form['#prefix'] = '<div id="modal-form">';
$form['#suffix'] = '</div>';
$form['messages'] = [
'#weight' => -9999,
'#type' => 'status_messages',
];
$form['actions']['submit']['#ajax'] = [
'callback' => 'chandan_form_ajax_validate',
'wrapper' => 'modal-form',
'progress' => [
'type' => 'throbber',
'message' => t('Saving...'),
],
];
$form['#attached']['library'][] = 'core/drupal.dialog.ajax';
return $form;
}
/**
* Handle errors in the modal.
*
* @param array $form
* The form passed by reference.
* @param \Drupal\Core\Form\FormStateInterface $form_state
* The form state.
*
* @return \Symfony\Component\HttpFoundation\Response
* The response object.
*/
function chandan_form_ajax_validate(&$form, $form_state) {
$response = new AjaxResponse();
if (!empty($form_state->getErrors())) {
$response->addCommand(new ReplaceCommand('#modal-form', $form));
return $response;
}
\Drupal::messenger()->addMessage(t('Succesfully saved.'));
$response->addCommand(new RedirectCommand('/user/1?success=1'));
return $response;
}
function chandan_entity_type_alter(array &$entity_types) {
$default_handler_class = $entity_types['user']->getHandlerClasses()['form']['default'];
$entity_types['user']->setFormClass('profile', $default_handler_class);
}
chandan.modal_user_profile_edit:
path: '/modal/edit/profile'
defaults:
_controller: 'Drupal\chandan\Controller\ChandanUserController::editProfile'
_title: 'Edit Profile'
requirements:
# Add proper permission.
_permission: 'access content'
class ChandanUserController extends ControllerBase {
/// class properties etc.
/// construction
public function editProfile() {
// Entity you want to edit.
$entity = User::load(1);
// Form builder service
$builder = \Drupal::service('entity.form_builder');
// get the form: form mode = 'profile', it is not default form mode.
// new form can be created on the "Form Display Setting"
$profile_form = $builder->getForm($entity, 'profile');
// return the form
return $profile_form;
}
}
{#
/**
* @file
* Theme override to present all user data.
*
* This template is used when viewing a registered user's page,
* e.g., example.com/user/123. 123 being the user's ID.
*
* Available variables:
* - content: A list of content items. Use 'content' to print all content, or
* print a subset such as 'content.field_example'. Fields attached to a user
* such as 'user_picture' are available as 'content.user_picture'.
* - attributes: HTML attributes for the container element.
* - user: A Drupal User entity.
*
* @see template_preprocess_user()
*/
#}
{{ attach_library('core/drupal.dialog.ajax') }}
<article{{ attributes.addClass('profile') }}>
{% if content %}
{{- content -}}
{% endif %}
</article>
<hr>
<div class="heading heading-border heading-middle-border">
<h4><strong>Account</strong> Information</h4>
</div>
<div class="row">
<div class="col-md-6">
<h3>Contact Information</h3>
{{ user.name.value }}<br>
{{ user.mail.value }}<br>
<a class="use-ajax ajax-login" data-dialog-options="{&quot;width&quot;:800}"
data-dialog-type="modal" href="/chandan/edit/profile">Edit</a>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment