CODEWITHSUNDEEP
javascriptjqueryajaxpromise
Sator
Sator

Reputation: 776

getting Cannot read property 'done' of undefined from ajax call

I have this ajax call which send data from an input element to the server

function upload_files() {
    let form_data = new FormData($('#form_upload')[0]); // wieso [0] ? == alle inputs auf einmal
    $.ajax({
        type: 'POST',
        url: '/receave_files_lambda',
        data: form_data,
        contentType: false,
        cache: false,
        processData: false,
        dataType: "json", // 
        success: flask_return_data => insertdata(flask_return_data)//
        });
}

which returns successfully a Json string,
I want to append callback functions if the call is successful
by decoupling the success function using done()

$(function (){
   $("#do_upload").on("click", function (){
       let ajax_promise = upload_files();
       ajax_promise.done(function (data){
           console.log(data);
       })
   })

});

function upload_files () {
}

which gave me an

Uncaught TypeError: Cannot read property 'done' of undefined

what causes the error ?

Upvotes: 0

Views: 132

Answers (1)

JavaMan
JavaMan

Reputation: 1217

Your problem is that you return nothing from your method "upload_files".

So you define $.ajax({...}) but you forgot to return it.

change your upload_files method to the following and it should work fine.

function upload_files() {
    let form_data = new FormData($('#form_upload')[0]); // wieso [0] ? == alle inputs auf einmal
    return $.ajax({
        type: 'POST',
        url: '/receave_files_lambda',
        data: form_data,
        contentType: false,
        cache: false,
        processData: false,
        dataType: "json", // 
        success: flask_return_data => insertdata(flask_return_data)//
        });
}

Upvotes: 2

Related Questions