यूआरएल

Question

से जेएसओएन के साथ jQuery यूआई स्वत: पूर्ण मैं jQuery UI स्वत: पूर्ण समारोह का उपयोग कर रहा हूं। मैं इसे jQuery UI के साथ प्रदान किए गए उदाहरण के साथ काम कर सकता हूं:

var availableTags = [ 
     "ActionScript", 
     "AppleScript", 
     "Asp", 
     "BASIC", 
     "C", 
     "C++", 
     "Clojure", 
     "COBOL", 
     "ColdFusion", 
     "Erlang", 
     "Fortran", 
     "Groovy", 
     "Haskell", 
     "Java", 
     "JavaScript", 
     "Lisp", 
     "Perl", 
     "PHP", 
     "Python", 
     "Ruby", 
     "Scala", 
     "Scheme" 
    ]; 

$("#tags").autocomplete({ 
    source: availableTags 
}); 

यह बिना किसी समस्या के काम करता है। लेकिन मैं अपने डेटा स्रोत है जो इस तरह के रूप में प्राप्त किए जा सकें JSON उपयोग करने की आवश्यकता: http://mysite.local/services/suggest.ashx?query=ball

मुझे लगता है कि यूआरएल के लिए जा रहा हूँ अगर मैं JSON मिल वापस इस तरह:

[{"id":12,"phrase":"Ball"},{"id":16,"phrase":"Football"},{"id":17,"phrase":"Softball"}] 

मैं अपने URL का उपयोग कैसे कर सकते हैं डेटा स्रोत के रूप में?

मैं इस तरह स्रोत विकल्प को बदलने की कोशिश की है:

$("#tags").autocomplete({ 
    source: "http://mysite.local/services/suggest.ashx" 
}); 

लेकिन यह मदद नहीं करता है। मुझे लगता है कि सेवा नहीं जानता कि इनपुट क्षेत्र में कौन सा कीवर्ड टाइप किया गया है या नहीं?

कोई भी पॉइंटर्स बहुत अच्छा होगा।

Answer 1

आपको निम्न विनिर्देशों को पूरा करने के लिए अपना स्रोत बदलना होगा (विजेट के लिए documentation में उल्लिखित)। स्रोत युक्त श्रेणी होनी चाहिए (या युक्त एक सरणी वापसी):

• सरल तार, या: एक label संपत्ति युक्त
• वस्तुओं, एक value संपत्ति, या दोनों।

अगर किसी कारण से आप अपना रिमोट स्रोत वापस नहीं कर रहे हैं, तो आप डेटा को बदल सकते हैं, इसे सफलतापूर्वक पुनर्प्राप्त करने के बाद आप डेटा को बदल सकते हैं। आप देख सकते हैं, तो आप अपने आप को AJAX के विजेट के source विकल्प के लिए एक समारोह में पारित करके फोन करने की आवश्यकता होगी

$("#tags").autocomplete({ 
    source: function (request, response) { 
     $.ajax({ 
      url: "http://mysite.local/services/suggest.ashx", 
      data: { query: request.term }, 
      success: function (data) { 
       var transformed = $.map(data, function (el) { 
        return { 
         label: el.phrase, 
         id: el.id 
        }; 
       }); 
       response(transformed); 
      }, 
      error: function() { 
       response([]); 
      } 
     }); 
    }); 
}); 

: यहाँ आप कैसे करेंगे।

विचार आपके सरणी को उस सरणी में बदलने के लिए $.map का उपयोग करना है जिसमें स्वत: पूर्ण विजेट पार्स कर सकते हैं।

यह भी ध्यान दें कि data पैरामीटर AJAX कॉल को पास किया गया है जब उपयोगकर्ता शब्द टाइप करता है तो ?query=<term> के रूप में समाप्त होना चाहिए।