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.

113 lines
5.0KB

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