xref: /webtrees/resources/views/modals/create-media-object.phtml (revision 8ec20abd79c212e7a7eb551d7b7b258fce55abb3)
1<?php use Fisharebest\Webtrees\I18N; ?>
2
3<form action="<?= e(route('create-media-object')) ?>" id="wt-modal-form" method="POST">
4    <?= csrf_field() ?>
5    <input type="hidden" name="ged" value="<?= e($tree->name()) ?>">
6
7    <?= view('modals/header', ['title' => I18N::translate('Create a media object')]) ?>
8
9    <div class="modal-body">
10        <?= view('modals/media-object-fields', ['max_upload_size' => $max_upload_size, 'media_types' => $media_types, 'unused_files' => $unused_files]) ?>
11    </div>
12
13    <?= view('modals/footer-save-cancel') ?>
14</form>
15
16<script>
17  // Submit the modal form using AJAX
18  document.getElementById('wt-modal-form').addEventListener('submit', function(event) {
19    event.preventDefault();
20    let form          = event.target;
21    let modal_content = document.querySelector('#wt-ajax-modal .modal-content');
22    let select        = document.getElementById(modal_content.dataset.selectId);
23
24    $.ajax({
25      url:         form.action,
26      type:        form.method,
27      data:        new FormData(form),
28      async:       false,
29      cache:       false,
30      contentType: false,
31      processData: false,
32      success:     function (data) {
33        if (select) {
34          // If this modal was activated by the "new" button in a select2
35          // edit control, then insert the result and select it.
36          $(select)
37            .select2()
38            .empty()
39            .append(new Option(data.text, data.id)).val(data.id)
40            .trigger('change');
41
42          $('#wt-ajax-modal').modal('hide');
43        } else {
44          modal_content.innerHTML = data.html;
45        }
46      },
47      failure:     function (data) {
48        modal_content.innerHTML = data.html;
49      }
50    });
51  });
52</script>
53