2009-05-20 2 views
5

मेरे पास पृष्ठ पर कुछ jquery/php इंटरैक्शन सेट है। यह सर्वर पर कुछ डेटा सबमिट करता है और डेटा के रिकॉर्ड्स को वापस ले जाता है जिसे पृष्ठ पर तुलना करने के लिए और उससे परे संभावित कार्रवाई के लिए गठबंधन किया जाता है।AJAX कॉल से डेटा लौटने और प्रदर्शित करने के लिए सर्वोत्तम अभ्यास

मेरा प्रश्न यह है कि जानकारी लौटने और फिर इसे प्रदर्शित करने के लिए सबसे अच्छा अभ्यास क्या है?

  • वापसी JSON ऑब्जेक्ट और फिर js और प्रदर्शन डेटा फिरते एचटीएमएल बनाने?
  • JSON ऑब्जेक्ट लौटाएं और फिर उस डेटा को पृष्ठ पर डेटा के लिए पहले से बनाए गए कंटेनर में डाल दें?
  • सर्वर से शुद्ध एचटीएमएल लौटें और बस इसे पेज पर रखें?

मैं कल रात मेरे सिर के माध्यम से इन रोलिंग किया गया था और वास्तव में समझ नहीं सकता है अगर एक ही रास्ता किसी विशेष कारण के लिए बेहतर होगा।

मैं एक जेएस गुरु नहीं हूं इसलिए वास्तव में इन विभिन्न तरीकों से पेशेवरों/विपक्ष और चेतावनियों को सुनिश्चित नहीं किया गया था।

उत्तर

7

मुझे लगता है कि यह आपके ऐप के आधार पर समाप्त होता है।

शुद्ध एचटीएमएल सबसे आसान है, आप बस जगह और व्हायोला में ड्रॉप करते हैं। JQuery उचित घटनाओं को जोड़ने और क्या नहीं करने के लिए एक हवा बनाता है।

हालांकि, जब भी मैंने AJAX का उपयोग किया है, यह हमेशा जेएसओएन लौटने और फ्लाई पर तत्वों के निर्माण में विकसित हुआ है। यदि आप उदाहरण के लिए पेड़ को पॉप्युलेट कर रहे हैं, तो उचित घोंसले पाने के लिए यह गन्दा हो सकता है। यह आपको क्लाइंट साइड कोड करने के लिए मजबूर करता है वैसे भी जिस समय बस शुरुआत से JSON का उपयोग क्लीनर है।

इसके अलावा, यदि आप अन्य पृष्ठों से डेटा कॉल का उपयोग करने की योजना बना रहे हैं तो JSON का उपयोग करने का तरीका है क्योंकि HTML को ठीक किया जाएगा।

-1

शुद्ध HTML लौटने का सबसे अच्छा समाधान है। अधिकांश भाग gzip को बैंडविड्थ में किसी भी अंतर को बेअसर करना चाहिए, और क्लाइंट पर जावास्क्रिप्ट के माध्यम से प्रतिपादन धीमा हो सकता है यदि क्लाइंट एक क्रैपी मशीन है। आखिरकार, एचटीएमएल प्रस्तुत करने के लिए जावास्क्रिप्ट लिखना मुश्किल है अगर आप एमवीसी का उपयोग करते हैं तो कुछ अच्छा इस्तेमाल करने की तुलना में काम करना मुश्किल है।

+0

यह प्रस्तुति के साथ डेटा मिश्रित करने के बाद से 'सर्वश्रेष्ठ' से बहुत दूर है। HTML में टेम्पलेट्स का उपयोग करने के लिए बहुत क्लीनर है और उन्हें डेटा – Javier

+1

हू के साथ पॉप्युलेट करना है? कुछ भी मिश्रित नहीं हो रहा है, यह मेरे दृष्टिकोण में एमवीसी के माध्यम से साफ-अलग सर्वर-साइड है। – RedFilter

0

यह हाल ही में आया और संभवतः एक डुप्ली: The AJAX response: Data (JSON, XML) or HTML snippet?

यदि आप एचटीएमएल बनाने जा रहे हैं तो आप सीधे एचटीएमएल वापस लौट सकते हैं और इसे डीओएम में इंजेक्ट कर सकते हैं। हालांकि, कई बार आपको ऑब्जेक्ट्स के साथ काम करने की ज़रूरत होती है, जहां जेएसओएन काम में आता है।

यदि आप उदाहरण के लिए एक व्यक्ति वस्तु वापस करते हैं तो आप व्यक्ति को नमस्कार कर सकते हैं और व्यक्ति को दिखा सकते हैं। संदर्भ जो वास्तव में आसान है। यह आपके डिज़ाइन पर निर्भर करता है लेकिन सामान्य विचारों को HTML को जावास्क्रिप्ट से बाहर रखना चाहिए जबतक कि आप आरआईए नहीं बना रहे हों।

+0

क्या आपने अभी इस प्रश्न के लिंक को अपने उत्तर में शामिल किया है? – montrealist

+0

उचित पोस्ट से जुड़ा हुआ है। बहुत सारी खिड़कियां खुली हैं =) – aleemb

4

यह पूरी तरह से आपके आवेदन में स्थापित चीजों के तरीके पर निर्भर करता है। मैं, एक के लिए, JSON (आपकी सूची में दूसरा दृष्टिकोण) वापस करना पसंद करता हूं, क्योंकि मेरे पास एक 'त्रुटि कोड' पैरामीटर है जिसे मैं पृष्ठ पर सामग्री को अपडेट करने से पहले SUccess फ़ंक्शन पर जांच करता हूं, और यदि यह शून्य नहीं है तो मैं उपयोगकर्ता को सूचित करता हूं त्रुटि से, सर्वर से वापस आने वाले त्रुटि संदेश सहित (सर्वर-साइड सत्यापन, डेटाबेस टाइमआउट, आदि)।

+0

बिल्कुल। जेएसओएन सुंदर है। – KyleFarris

0

मैं सभी तीन का इस्तेमाल किया है और इस निष्कर्ष पर आ गए हैं कि लौटने एचटीएमएल बेहतर जब एक पृष्ठ के लिए नए तत्वों के है।

मेरे experiance है कि जब जावास्क्रिप्ट मैं आमतौर पर काम हो चुका होगा कि नकल कर रहा हूँ के साथ HTML निर्माण गैर जावास्क्रिप्ट उपयोगकर्ता यात्रा के लिए किया गया है है।

मैं अभी भी मौजूदा तत्वों को अद्यतन करने या जावास्क्रिप्ट केवल कार्यक्षमता बनाने के लिए json पार्स करने पसंद करते हैं। मैं बैंडविड्थ के लिए खुद को बताता हूं, लेकिन मुझे लगता है कि यह सिर्फ इसलिए है क्योंकि मुझे जावास्क्रिप्ट पसंद है।

एक आगे विकल्प के रूप में, मैं कैसे फ़्लिकर स्ट्रिंग concatination के साथ डेटा की विशाल मात्रा के साथ सौदा के बारे में बहुत पोस्ट पढ़ें। असल में बस पाइप के नीचे एक बड़ा ओ 'स्ट्रिंग पार्स और क्लाइंट पर इसे काट लें। इससे क्लाइंट पर केवल मामूली वृद्धि के साथ सर्वर पर काफी कमी आती है।

2

अपने प्रश्न का हिस्सा "से परे संभव कार्रवाई" एक बड़ा अंतर बना देता है। यदि आपको डेटा के साथ अन्य चीजों को प्रदर्शित करने के अलावा इसे प्रदर्शित करने की आवश्यकता है, तो JSON के रूप में लौटना एक स्पष्ट रूप से बेहतर विकल्प है क्योंकि आप HTML DOM को पार करने के बजाय डेटा को मूल जावास्क्रिप्ट ऑब्जेक्ट के रूप में काम कर सकते हैं। यदि आप जो भी करना चाहते हैं वह इसे प्रदर्शित करता है, तो मुझे जावास्क्रिप्ट में प्रदर्शित होने वाली इमारत की परेशानी से गुज़रने का कोई कारण नहीं दिखता है; बस सर्वर पर अपनी प्रस्तुति परत में एचटीएमएल बनाएँ।

1

मुझे लगता है कि आप एक पूरी तरह से वैध विकल्प, एक जो मैं अक्सर उपयोग नहीं कर पाएंगे। यह मेरा ठेठ स्कीमा है और यह अभी तक मुझे विफल है ... :-)

यहाँ मैं का उपयोग बुनियादी jQuery टेम्पलेट है:

$(function() { 
    $.getJSON('/some/page',{foo:bar,bar:foo},function(json) { 
     if(json.outcome == 'success') { 
      $('body').prepend(json.html); 
     } else { 
      // Somehow let the user know why it didn't work 
      alert(json.error); 
     } 
    }); 
}); 

यहाँ (मेरे मामले में PHP) बुनियादी बैकएंड है संरचना का उपयोग मैं :

<?php // Page: '/some/page' 

/* Blah Blah Blah... do whatever needs to be done... */ 

// If everything turns out okay (assuming '$output' is the HTML 
// you want to display... 
echo json_encode(array('outcome'=>'success','html'=>$output)); 

// If something goes wrong... just do: 
echo json_encode(array('outcome'=>'error','error'=>'Uh oh... something is broken')); 

स्वाभाविक रूप से, आप उन्हें कुछ चर या कुछ में डालकर अपनी त्रुटि के साथ अधिक विशिष्ट होना चाहते हैं। लेकिन, आपको विचार मिलना चाहिए। इसके अलावा, निश्चित रूप से आप जेसन आउटपुट में अधिक जानकारी जोड़ सकते हैं। आपके पास कुछ पूर्व-निर्मित HTML और कुछ अन्य जानकारी जैसे 'सफलता नोटिस' या कुछ तत्वों के लिए एक नया वर्ग नाम हो सकता है, मुझे पता है ... जो कुछ भी ... संभावनाएं अनंत हैं।

फिर भी, कारण मैं इस मार्ग चुनें (मेरे अनुभव के आधार पर) के बजाय JSON से अधिक पाशन और सामान डालने जब तक यह, बस जैसे, का एक सा से डोम के लिए पूर्व निर्मित एचटीएमएल संलग्न करने के लिए यह आम तौर पर तेजी से है, क्योंकि है एक तत्व में बदलने के लिए पाठ। लेकिन, मैंने जो तरीका दिखाया है वह है, आईएमओ, दोनों दुनिया के सर्वश्रेष्ठ। आप JSON गुणों में से किसी एक को स्ट्रिंग के रूप में HTML संलग्न कर सकते हैं।

हैप्पी jQueryिंग :-)