0

File upload button on one file and popup form in another file("/uploadFile"). I want to popup form after upload file submit/on "ok" click.

This is my first file index.html where I have list that have upload file button:

<li><a href="/uploadFile"><input type="file" id="hiddenUploadField"  style="display: none;" accept=".dxf, .dwg"
            class="upload" data-toggle="modal" data-target="#importData">
            <label for="hiddenUploadField"><i class="fas fa-folder-open"></i>&nbsp;<span>Import</span></label></a>
          </li>

At the end of file I use this code for popup modal:

<div class="modal fade text-center" id="importData" >
<div class="modal-dialog modal-lg">
  <div class="modal-content">
  </div>
</div>

The code to trigger the popup is:

$('#hiddenUploadField').change(function (e) {
var node = $('#appBuckets').jstree(true).get_selected(true)[0];
var _this = this;
if (_this.files.length == 0) return;
var file = _this.files[0];
switch (node.type) {
  case 'bucket':
    var formData = new FormData();
    formData.append('fileToUpload', file);
    formData.append('bucketKey', node.id);
    $.ajax({
      url: '/api/forge/oss/objects',
      data: formData,
      processData: false,
      contentType: false,
      type: 'POST',
      success: function (data) {
        $('#appBuckets').jstree(true).refresh_node(node);
        _this.value = '';
      }
    });
    break;
}
$('#importData').modal('show').find('.modal-content').load($(this).attr('href'));
});
}

The problem is when I click "ok" on the file window, it does not show up the modal popup box. It just fades the background and does nothing.

m123
  • 2,824
  • 1
  • 11
  • 29
SHEETAL RANDHAVAN
  • 1
  • 2

1 Answers1

0

Your code to show the modal is need to inside the change function, like this

$('#hiddenUploadField').change(function (e) {
    // your code goes here for the modal.
    $('#importData').modal('show').find('.modal-content').load($(this).attr('href')); }
});
DVS
  • 326
  • 1
  • 7