Two JQuery Ajax Call on same page

Question

I am uploading two different type of file with ajax by using two different function. The problem is->the timeout which is set for the first request has been set for other request also.. so if first file is too large and take almost 2 mins for uploading, then next file which is an image of very small size uploaded by next ajax request with a different time out will be also take same 2 mins for uploading.. here i am uploading file directly to amazon.

Below is the ajax function to upload my second file with a small timeout

    xhr_request1=$.ajax({
                url: 'uploader.php',  //server script to process data
                type: 'POST',
                //Ajax events
                beforeSend: function(){beforeSendHandler(fileLoading);},
                success: function(response) {completeHandler(response,fileName,fileLoading,filePreview,fileUpload,filename);},
               // error: function(xhr,tStatus,err ) {errorHandler(err,fileLoading,filePreview);},
                // Form data
                data: formData,
                //Options to tell JQuery not to process data or worry about content-type
                cache: false,
                contentType: false,
                processData: false,
                timeout:50000
            });

and below is next function to upload large files

xhr_request2=$.ajax({
                url: 'contentuploader.php',  //server script to process data
                type: 'POST',
                //Ajax events
                beforeSend: function(){beforeSendHandler1(fileLoading1);},
                success: function(response) {completeHandler1(response,fileName1,fileLoading1,filePreview1,fileUpload1,filename1);},
               // error: function(xhr,tStatus,err ) {errorHandler(err,fileLoading,filePreview);},
                // Form data
                data: formData,
                //Options to tell JQuery not to process data or worry about content-type
                cache: false,
                contentType: false,
                processData: false,
                timeout:1000000
            });

Could you please explain why your setting a timeout since u r using a two different function. — Bala Varadarajan, Jan 23 '14 at 08:03
http://stackoverflow.com/questions/18728004/simultaneous-ajax-calls check this it might help you. — Abhik Chakraborty, Jan 23 '14 at 08:04
Bala Varadarajan sir i am having same problem if dont use timeout — user3226775, Jan 23 '14 at 10:22
@Hüseyin BABAL sir it depends... it may be run one after another or may run simultaniously. — user3226775, Jan 23 '14 at 10:23

score 0 · Answer 1 · edited May 23 '17 at 11:56

you make manually object of form data as your required parameter

    var fd = new FormData();    
   fd.append( 'file', input.files[0] );


     $.ajax({
  url: 'http://example.com/script.php',
  data: fd,
  processData: false,
  contentType: false,
  type: 'POST',
  success: function(data){
    alert(data);
  }
});

You can follow this link
1.) How to send FormData objects with Ajax-requests in jQuery?

Two JQuery Ajax Call on same page

1 Answers1