vendor/easycorp/easyadmin-bundle/src/Resources/views/default/edit.html.twig line 1

Open in your IDE?
  1. {% form_theme form with easyadmin_config('design.form_theme') only %}
  3. {% set _entity_config = easyadmin_entity(app.request.query.get('entity')) %}
  4. {% set _entity_id = attribute(entity, _entity_config.primary_key_field_name) %}
  5. {% trans_default_domain _entity_config.translation_domain %}
  6. {% set _trans_parameters = { '%entity_name%': _entity_config.name|trans, '%entity_label%': _entity_config.label|trans, '%entity_id%': _entity_id } %}
  8. {% extends _entity_config.templates.layout %}
  10. {% block body_id 'easyadmin-edit-' ~ _entity_config.name ~ '-' ~ _entity_id %}
  11. {% block body_class 'edit edit-' ~ _entity_config.name|lower %}
  13. {% block content_title %}
  14.     {% apply spaceless %}
  15.         {% set _default_title = 'edit.page_title'|trans(_trans_parameters, 'EasyAdminBundle') %}
  16.         {{ _entity_config.edit.title is defined ? _entity_config.edit.title|trans(_trans_parameters) : _default_title }}
  17.     {% endapply %}
  18. {% endblock %}
  20. {% block content_footer_wrapper '' %}
  22. {% block main %}
  23.     {% block entity_form %}
  24.         {{ form(form) }}
  25.     {% endblock entity_form %}
  27.     {% block delete_form %}
  28.         {{ include('@EasyAdmin/default/includes/_delete_form.html.twig', {
  29.             view: 'edit',
  30.             referer: app.request.query.get('referer', ''),
  31.             delete_form: delete_form,
  32.             _translation_domain: _entity_config.translation_domain,
  33.             _trans_parameters: _trans_parameters,
  34.             _entity_config: _entity_config,
  35.         }, with_context = false) }}
  36.     {% endblock delete_form %}
  37. {% endblock %}
  39. {% block body_javascript %}
  40.     {{ parent() }}
  42.     <script type="text/javascript">
  43.         $(function() {
  44.             $('.edit-form').areYouSure({ 'message': '{{ 'form.are_you_sure'|trans({}, 'EasyAdminBundle')|e('js') }}' });
  46.             const entityForm = document.querySelector('form.edit-form');
  47.             const formSubmitButton = entityForm.querySelector('button[type="submit"]');
  48.             const inputFieldsSelector = 'input,select,textarea';
  50.             // Adding visual feedback for invalid fields: any ".form-group" with invalid fields
  51.             // receives "has-error" class. The class is removed on click on the ".form-group"
  52.             // itself to support custom/complex fields.
  53.             formSubmitButton.addEventListener('click', function() {
  54.                 entityForm.querySelectorAll(inputFieldsSelector).forEach(function (input) {
  55.                     if (!input.validity.valid) {
  56.                         const formGroup = input.closest('div.form-group');
  58.                         formGroup.classList.add('has-error');
  60.                         formGroup.addEventListener('click', function onFormGroupClick() {
  61.                             formGroup.classList.remove('has-error');
  62.                             formGroup.removeEventListener('click', onFormGroupClick);
  63.                         });
  64.                     }
  65.                 });
  66.             });
  68.             // forms with tabs require some special treatment for errors. The problem
  69.             // is when the field with errors is included in a tab not currently visible.
  70.             // Browser shows this error "An invalid form control with name='...' is not focusable."
  71.             // So, the user clicks on Submit button, the form is not submitted and the error
  72.             // is not displayed. This JavaScript code ensures that each tab shows a badge with
  73.             // the number of errors in it.
  74.             formSubmitButton.addEventListener('click', function() {
  75.                 const formTabPanes = entityForm.querySelectorAll('.tab-pane');
  76.                 if (0 === formTabPanes.length) {
  77.                     return;
  78.                 }
  80.                 let firstNavTabItemWithError = null;
  82.                 formTabPanes.forEach(function (tabPane) {
  83.                     let tabPaneNumErrors = 0;
  84.                     tabPane.querySelectorAll(inputFieldsSelector).forEach(function (input) {
  85.                         if (!input.validity.valid) {
  86.                             tabPaneNumErrors++;
  87.                         }
  88.                     });
  90.                     let navTabItem = entityForm.querySelector('.nav-item a[href="#' + tabPane.id + '"]');
  91.                     let existingErrorBadge = navTabItem.querySelector('span.badge.badge-danger');
  92.                     if (null !== existingErrorBadge) {
  93.                         navTabItem.removeChild(existingErrorBadge);
  94.                     }
  96.                     if (tabPaneNumErrors > 0) {
  97.                         let newErrorBadge = document.createElement('span');
  98.                         newErrorBadge.classList.add('badge', 'badge-danger');
  99.                         newErrorBadge.title = 'form.tab.error_badge_title';
  100.                         newErrorBadge.textContent = tabPaneNumErrors;
  102.                         navTabItem.appendChild(newErrorBadge);
  104.                         if (null === firstNavTabItemWithError) {
  105.                             firstNavTabItemWithError = navTabItem;
  106.                         }
  107.                     }
  108.                 });
  110.                 if (firstNavTabItemWithError) {
  111.                     firstNavTabItemWithError.click();
  112.                 }
  113.             });
  115.             $('a.action-delete').on('click', function(e) {
  116.                 e.preventDefault();
  118.                 $('#modal-delete').modal({ backdrop: true, keyboard: true })
  119.                     .off('click', '#modal-delete-button')
  120.                     .on('click', '#modal-delete-button', function () {
  121.                         $('#delete-form').trigger('submit');
  122.                     });
  123.             });
  124.         });
  125.     </script>
  127.     {{ include('@EasyAdmin/default/includes/_select2_widget.html.twig') }}
  128. {% endblock %}