0

I initiate a function after an ajax load(), but the function I intimate calls upon an additional function, which isn't working. How do I initiate ajaxstuff() after load()?

function ajaxstuff(data) {
    $.ajax({
        type: "POST",
        url: "do-it.php",
        data: {data},
        success: function() {
            console.log('I got this far'); // this doesn't work / isn't called
        }
    });
}

function doit() {
    $('form').submit(function(e) {
        e.preventDefault();
        var formData = new FormData(this);
        console.log('I got this far'); // this works
        ajaxstuff(formData);
    }
}

$('.popup-loader').click(function() {
    $(this).append('<div class="popup"></div>');
    $('.popup').load('popup.php', function() {
        doit(); // this works
    }
});
Mike Laren
  • 8,028
  • 17
  • 51
  • 70
user2250471
  • 1,002
  • 3
  • 10
  • 23
  • 1
    in ajaxstuff method, I see only the success callback. Try adding the error: function (xhr, textStatus, errorThrown) { } to see if you are getting any error. – Vim Mar 30 '15 at 21:07
  • Also, I see that you are sending FormData to ajax post. Set, data: data, processData: false. – Vim Mar 30 '15 at 21:20
  • maybe start by reading the documentation http://api.jquery.com/jquery.ajax/ there is no "load" scenario with ajax, you have success, fail, and always – Jeff Voss Mar 30 '15 at 22:00
  • possible duplicate of [How to do a Jquery Callback after form submit?](http://stackoverflow.com/questions/11534690/how-to-do-a-jquery-callback-after-form-submit) – Vickel Apr 02 '15 at 16:45
  • Try removing the curly brackets from `data` whithin your Ajax call – Clay Banks Apr 04 '15 at 02:07

2 Answers2

-2

Syntax error in ajaxstuff function. data: {data}, , probably should be data: data,

Also when you're passing a FormData object to $.ajax, you have to specify processData: false and contentType: false

$.ajax({
    type: "POST",
    url: "do-it.php",
    data: data,
    processData: false,
    contentType: false,
    success: function() {
        console.log('I got this far'); 
    }
});
Musa
  • 96,336
  • 17
  • 118
  • 137
-2

Check for errors in your console, also, in your AJAX add an async option. set it to FALSE ("Setting async to false means that the statement you are calling has to complete before the next statement in your function can be called"):

function ajaxstuff(data) {
    $.ajax({
        async: false,
        type: "POST",
        url: "do-it.php",
        data: data,
        success: function(result) {
             console.log(result); //check in your console for errors
        }
    });
}
CodeGodie
  • 12,116
  • 6
  • 37
  • 66