0

I'm loading a form using Nivo Lightbox AJAX.

form#users-add

Now I use another AJAX function to submit the form:

var users_add = $('#users-add');
users_add.submit(function (e) {
    e.preventDefault();
    $.ajax({
        type: users_add.attr('method'),
        url: users_add.attr('action'),
        data: users_add.serialize(),
        success: function (data) {
            if (data == 'users-add-success') {
                $('#users-add-cbk').html('<div class="alert alert-success" role="alert">Utilisateur ajouté!</div>');
                users_add[0].reset();
            } else {
                $('#users-add-cbk').html('<div class="alert alert-danger" role="alert">Une erreur c\'est produite.</div>');
            }
        },
        error: function (data) {
            $('#users-add-cbk').html('<div class="alert alert-danger" role="alert">Une erreur c\'est produite.</div>');
        },
    });
});

The problem here is that I have to re-map the DOM as form#users-add wasn't there when the the document has been fully loaded.

How to properly make the form#users-add seen by the script?

Maistrenko Vitalii
  • 994
  • 1
  • 8
  • 16
medk
  • 9,233
  • 18
  • 57
  • 79
  • 1
    Use event delegation. `$(document).on("submit", "#users-add", ...` – freedomn-m Mar 27 '18 at 13:14
  • @freedomn-m I tired $(document).on('submit', '#users-add', function() { but it still sends directly not through AJAX. – medk Mar 27 '18 at 13:19
  • I can't see *anywhere* in your question that states it sends directly - only that you couldn't see the form. I'd suggest raising a new question, but that would be a duplicate as well: change your button from ` – freedomn-m Mar 27 '18 at 13:34

0 Answers0