You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

124 lines
5.2KB

  1. {# @var ea \EasyCorp\Bundle\EasyAdminBundle\Context\AdminContext #}
  2. {# @var entity \EasyCorp\Bundle\EasyAdminBundle\Dto\EntityDto #}
  3. {% set form = edit_form %}
  4. {% extends '@LcSov/adminlte/crud/_form.html.twig' %}
  5. {% block body_id 'ea-edit-' ~ entity.name ~ '-' ~ entity.primaryKeyValue %}
  6. {% block body_class 'ea-edit ea-edit-' ~ entity.name %}
  7. {% block content_title %}
  8. {%- apply spaceless -%}
  9. {{ ea.crud.customPageTitle is null
  10. ? (ea.crud.defaultPageTitle|trans(ea.i18n.translationParameters, 'EasyAdminBundle'))|raw
  11. : ea.crud.customPageTitle|trans(ea.i18n.translationParameters)|raw }}
  12. {%- endapply -%}
  13. {% endblock %}
  14. {% block delete_form %}
  15. {{ include('@EasyAdmin/crud/includes/_delete_form.html.twig', { entity_id: entity.primaryKeyValue }, with_context = false) }}
  16. {% endblock delete_form %}
  17. {#
  18. {% block body_javascript %}
  19. {{ parent() }}
  20. <script type="text/javascript">
  21. $(function () {
  22. $('.ea-edit-form').areYouSure({'message': '{{ 'form.are_you_sure'|trans({}, 'EasyAdminBundle')|e('js') }}'});
  23. const entityForm = document.querySelector('form.ea-edit-form');
  24. const inputFieldsSelector = 'input,select,textarea';
  25. // Adding visual feedback for invalid fields: any ".form-group" with invalid fields
  26. // receives "has-error" class. The class is removed on click on the ".form-group"
  27. // itself to support custom/complex fields.
  28. entityForm.addEventListener('submit', function (submitEvent) {
  29. entityForm.querySelectorAll(inputFieldsSelector).forEach(function (input) {
  30. if (!input.validity.valid) {
  31. const formGroup = input.closest('div.form-group');
  32. formGroup.classList.add('has-error');
  33. formGroup.addEventListener('click', function onFormGroupClick() {
  34. formGroup.classList.remove('has-error');
  35. formGroup.removeEventListener('click', onFormGroupClick);
  36. });
  37. }
  38. });
  39. const eaEvent = new CustomEvent('ea.form.submit', {
  40. cancelable: true,
  41. detail: {page: 'edit', form: entityForm}
  42. });
  43. const eaEventResult = document.dispatchEvent(eaEvent);
  44. if (false === eaEventResult) {
  45. submitEvent.preventDefault();
  46. submitEvent.stopPropagation();
  47. }
  48. });
  49. // forms with tabs require some special treatment for errors. The problem
  50. // is when the field with errors is included in a tab not currently visible.
  51. // Browser shows this error "An invalid form control with name='...' is not focusable."
  52. // So, the user clicks on Submit button, the form is not submitted and the error
  53. // is not displayed. This JavaScript code ensures that each tab shows a badge with
  54. // the number of errors in it.
  55. entityForm.addEventListener('submit', function () {
  56. const formTabPanes = entityForm.querySelectorAll('.tab-pane');
  57. if (0 === formTabPanes.length) {
  58. return;
  59. }
  60. let firstNavTabItemWithError = null;
  61. formTabPanes.forEach(function (tabPane) {
  62. let tabPaneNumErrors = 0;
  63. tabPane.querySelectorAll(inputFieldsSelector).forEach(function (input) {
  64. if (!input.validity.valid) {
  65. tabPaneNumErrors++;
  66. }
  67. });
  68. let navTabItem = entityForm.querySelector('.nav-item a[href="#' + tabPane.id + '"]');
  69. let existingErrorBadge = navTabItem.querySelector('span.badge.badge-danger');
  70. if (null !== existingErrorBadge) {
  71. navTabItem.removeChild(existingErrorBadge);
  72. }
  73. if (tabPaneNumErrors > 0) {
  74. let newErrorBadge = document.createElement('span');
  75. newErrorBadge.classList.add('badge', 'badge-danger');
  76. newErrorBadge.title = 'form.tab.error_badge_title';
  77. newErrorBadge.textContent = tabPaneNumErrors;
  78. navTabItem.appendChild(newErrorBadge);
  79. if (null === firstNavTabItemWithError) {
  80. firstNavTabItemWithError = navTabItem;
  81. }
  82. }
  83. });
  84. if (firstNavTabItemWithError) {
  85. firstNavTabItemWithError.click();
  86. }
  87. });
  88. $('.action-delete').on('click', function (e) {
  89. e.preventDefault();
  90. const formAction = $(this).attr('formaction');
  91. $('#modal-delete').modal({backdrop: true, keyboard: true})
  92. .off('click', '#modal-delete-button')
  93. .on('click', '#modal-delete-button', function () {
  94. $('#delete-form').attr('action', formAction).trigger('submit');
  95. });
  96. });
  97. });
  98. </script>
  99. <
  100. {% endblock %}
  101. #}