2011-06-07 9 views
5

सिंक्रोनस AJAX कॉल करने के अलावा यदि आप कर सकते हैं और सोचते हैं कि यह उचित है, तो इस तरह कुछ संभालने का सबसे अच्छा तरीका क्या है?विभिन्न AJAX कॉल से डेटा कैसे जमा करें?

var A = getDataFromServerWithAJAXCall(whatever); 
var B = getDataFromServerWithAJAXCallThatDependsOnPreviousData(A); 
var C = getMoreDataFromServerWithAJAXCall(whatever2); 

processAllDataAndShowResult(A,B,C); 

बशर्ते कि मैं उन कार्यों के लिए कॉलबैक के पास कर सकते हैं, मुझे पता है मैं बंद और lambdas उपयोग कर सकते हैं काम इस तरह किया जाना:

var A,B,C; 

getDataFromServerWithAJAXCall(whatever, function(AJAXResult) { 
    A= AJAXResult; 
    getDataFromServerWithAJAXCallThatDependsOnPreviousData(A, function(AJAXResult2) { 
     B= AJAXResult2; 
     processAllDataAndShowResult(A,B,C); 
    }); 
}); 
getMoreDataFromServerWithAJAXCall(whatever2, function(AJAXResult) { 
    C= AJAXResult; 
    processAllDataAndShowResult(A,B,C); 
}); 

function processAllDataAndShowResult(A,B,C) { 
    if(A && B && C) { 
     //Do stuff 
    } 
} 

लेकिन यह सही है या पर्याप्त साफ महसूस नहीं करता है मेरे लिए। तो क्या एक बेहतर तरीका है या कम से कम एक क्लीनर तरीका एक ही काम करने के लिए है या यह सिर्फ इतना है कि मैं जावास्क्रिप्ट कार्यात्मक प्रोग्रामिंग के लिए उपयोग नहीं किया जाता है?

वैसे, मैं jQuery (1.4.2) है कि अगर मदद करता है उपयोग कर रहा हूँ।

धन्यवाद।

+0

आप नहीं पूछ रहे हैं कि आपकी कॉल को कैसे कम करें? लगातार तीन AJAX कॉल करने का सबसे अच्छा तरीका क्या है? –

+0

यह सही है। क्या आपके पास सर्वर को सभी डेटा एक बार में वापस करने के अलावा इस अर्थ में कोई अन्य सुझाव है? – Xay

उत्तर

0

आप jQuery 1.5 का उपयोग कर सकते हैं, तो आप deferred object और $.when()

$.when(getDataFromServerWithAJAXCall("Call 1"), getMoreDataFromServerWithAJAXCall("Call 2")).done(function(a1, a2) { 
    var jqXHR = a1[2]; 
    jqXHR.responseText; 
    getDataFromServerWithAJAXCallThatDependsOnPreviousData(jqXHR.responseText); 
}); 

का उपयोग कर सीधे शब्दों में कहें, जब पहले दो पूरा कार्यों तो यह तीसरे समारोह निष्पादित करेंगे के माध्यम से अपनी आवश्यकताओं को पूरा करने के लिए सक्षम होना चाहिए।

Example on jsfiddle

+0

क्षमा करें, jQuery 1.4.2 का उपयोग करके, कोई अन्य सुझाव? – Xay

0

प्रत्येक AJAX कॉल के कॉलबैक फ़ंक्शन एक आम स्थानीय भंडारण में/स्टोर परिणामों की जांच करने के लिए सुनिश्चित करें। और एक और प्रसंस्करण कार्य है जो इस कंटेनर से पढ़ता है, शायद नियमित अंतराल पर या प्रत्येक कॉलबैक द्वारा सक्रिय किया जाता है। इस तरह आप अजाक्स कॉल पर ध्यान केंद्रित करते हैं और फोकस करते हैं। यह एन अजाक्स कॉल को संचयनीय स्केलेबल भी रखता है, और आपको एक नया कॉल जोड़ने पर मौजूदा कोड को संशोधित करने की आवश्यकता नहीं है।

5

हाँ, jQuery के Deferred Object सुपर आसान है।

यहाँ $.when() समारोह documentation से उदाहरण दिया गया है, आपके समस्या का समाधान illustrating:

$.when($.ajax("/page1.php"), $.ajax("/page2.php")).done(function(a1, a2){ 
    /* a1 and a2 are arguments resolved for the 
     page1 and page2 ajax requests, respectively */ 
    var jqXHR = a1[2]; /* arguments are [ "success", statusText, jqXHR ] */ 
    if (/Whip It/.test(jqXHR.responseText)) { 
     alert("First page has 'Whip It' somewhere."); 
    } 
}); 

चीयर्स!

+0

क्षमा करें, jQuery 1.4.2 का उपयोग करके, कोई अन्य सुझाव? – Xay

0

उपयोग एक तथाकथित 'उलटी गिनती कुंडी'

  1. कार्यों में से प्रत्येक के लिए अपने स्वयं के कॉलबैक है।
  2. एक चर countdownlatch कहा जाता है हर बार एक समारोह में कहा जाता है और उलटी गिनती बढ़ा जा है जब कॉलबैक से प्रत्येक पहुँच जाता है (async त्रुटि पर उलटी गिनती के साथ ही कर लें।
  3. कॉलबैक से प्रत्येक को अलग से करने के लिए जाँच करता है यदि countdownlatch==0 देख यदि ऐसा है तो फ़ंक्शन को कॉल processAllDataAndShowResult

async सिंक्रनाइज़ेशन इस तरह है कि एक countdownlatch को लागू करने, सुपर आसान है क्योंकि जावास्क्रिप्ट एकल पिरोया, यानी है साथ जावास्क्रिप्ट की सुंदरता: कोई रास्ता नहीं countdownlatch मिल सकता है फंकी संख्या bec रेसिंग स्थितियों का उपयोग क्योंकि ये अस्तित्व में नहीं हैं (इस स्थिति में)।

संपादित

नहीं देखा बी ए पर निर्भर है, लेकिन एक ही सिद्धांत लागू होता है:

var A,B,C; 
var cdlatch = 2; 
getDataFromServerWithAJAXCall(whatever, function(AJAXResult) { 
    A= AJAXResult; 
    getDataFromServerWithAJAXCallThatDependsOnPreviousData(A, function(AJAXResult2) { 
     B= AJAXResult2; 
     if(--cdlatch === 0){ 
      processAllDataAndShowResult(A,B,C); 
     } 
    }); 
}); 
getMoreDataFromServerWithAJAXCall(whatever2, function(AJAXResult) { 
    C= AJAXResult; 
    if(--cdlatch === 0){ 
     processAllDataAndShowResult(A,B,C); 
    } 
}); 

function processAllDataAndShowResult(A,B,C) { 
    //Do stuff 
} 

मैं यह है कि सामान्य स्थिति मैंने पहले बताया गया है, ओह के रूप में स्पष्ट नहीं है अच्छी तरह से स्वीकार करना होगा ।

संबंधित मुद्दे