title: ajax call doesn't work in modal call in ajax
body: <p>first, sorry for my English !
  I tried to explain my problem :
  I have a modal (bootstrap) who is populate with an ajax call, in this modal I have a form and the submission is in ajax.
  When I call the modal I have no problem, the form is display fine but when I submit the form (with ajax) nothing append, the function is called ok (if i put a console.log in the called function I have the trace) but the ajax call not work ...
  Here is my process :
  first I have a button who call the first ajax to open the modal with the goof form :</p>
  <pre><code>&lt;a class=&quot;btn btn-info _filemanager waves-effect waves-light&quot; data-toggle=&quot;modal&quot; data-target=&quot;#defaultModal&quot; data-id=&quot;course_visuel&quot;&gt;Carte et bandeau&lt;/a&gt;
  </code></pre>
  <p>in the modal I have a form call with this code :</p>
  <pre><code>$(document).on('click', '._filemanager', function(){
   $('#default-modal-content').html(spinner());
   var input = $(this).data('id');
   $.ajax({
       url: '/ged/ajax/dialog',
       type: 'POST',
       data: 'input=' + input,
       processData: false,
       dataType: false,
       cache: false,
       getScript: true,
       async: true,
   })
   .done(function(s) {
       var res = jQuery.parseJSON(s);
       if(res.status == 'success') {
           $('#default-modal-content').html(res.html);
           $('.mdb-select').materialSelect();
       }
   });
  });
  </code></pre>
  <p>here is the code from the form :</p>
  <pre><code>&lt;form id=&quot;formFolderGed&quot;&gt;
              &lt;div class=&quot;form-group md-form&quot;&gt;
                  &lt;input class=&quot;form-control&quot; name=&quot;ged_folders_name&quot; type=&quot;text&quot; required&gt;
                  &lt;label for=&quot;ged_folders_name&quot;&gt;{{ l.folder_name }}&lt;sup class=&quot;text-red&quot;&gt;&lt;b&gt;*&lt;/b&gt;&lt;/sup&gt;&lt;/label&gt;
              &lt;/div&gt;
              &lt;div class=&quot;form-group md-form&quot;&gt;
                  &lt;label for=&quot;ged_folders_id&quot; class=&quot;active&quot;&gt;{{ l.choose_parent }}&lt;/label&gt;
                  &lt;select name=&quot;ged_folders_id&quot; class=&quot;mdb-select md-form colorful-select dropdown-primary&quot;&gt;
                      &lt;option value=&quot;{{ parents.ged_folders_id }}&quot;&gt;{{ parents.ged_folders_name }}&lt;/option&gt;
                      {{ _self.selectFolder(parents, 1) }}
                  &lt;/select&gt;
              &lt;/div&gt;
  
              &lt;div class=&quot;panelFooter&quot;&gt;
                  &lt;div class=&quot;form-group&quot;&gt;
                      &lt;button class=&quot;btn btn-success btn-sm&quot; type=&quot;submit&quot;&gt;{{ l.submit }}&lt;/button&gt;
                      &lt;button class=&quot;btn btn-primary btn-sm _openFolderForm&quot; type=&quot;button&quot;&gt;{{ l.annule }}&lt;/button&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/form&gt;
  </code></pre>
  <p>when I submit the form, I call this function :</p>
  <pre><code>$(document).on('submit', 'form#formFolderGed', function(e){
  $('#default-modal-content').html(spinner());
  e.preventDefault();
  var formData = new FormData(this);
  $.ajax({
      url: '/ged/ajax/dialog',
      type: 'POST',
      data: formData,
      processData: false,
      contentType: false,
      cache: false,
      enctype: 'multipart/form-data',
      async: true,
  })
  .done(function(s) {
      var res = jQuery.parseJSON(s);
      if(res.status == 'success') {
          $('#default-modal-content').html(res.html);
      }
  });
  });
  </code></pre>
  <p>the first ajax call is ok but when I submit the form ... no ajax, if I do that :</p>
  <pre><code>$(document).on('submit', 'form#formFolderGed', function(e){
     console.log('ok');
     .......
  </code></pre>
  <p>I have the 'ok' in the console but the ajax call doesn't work (no trace in the network/xhr panel in the console) ...
  Where is my mistake ?????
  Thanks for your help !</p>