jquery autocomplete

Question

में लुकअप और/या सेवा यूआरएल का उपयोग करें मेरे पास मेरे एप्लिकेशन में एक स्वतः पूर्ण सुविधा है जो सर्वर पर AJAX अनुरोध करता है। हालांकि, एक बार जब मैं सर्वर से डेटा प्राप्त करता हूं, तो मैं सेवा url (सर्वर पर कॉल को कम करने के लिए) का उपयोग करने के बजाय लुकअप सुविधा का उपयोग करना चाहता हूं। 'भारत, आइसलैंड, इंडोनेशिया "-

यहाँ क्या मेरी js लगता है कि

$('#country').autocomplete({ 
    serviceUrl : './countryCache?', 
    paramName : 'countryName', 
    transformResult : function(response) { 
     return { 
      // must convert json to javascript object before process 
      suggestions : $.map($.parseJSON(response), function(item) { 
       return { 
        data : item.name 
       }; 
      }) 
     }; 
    }, 
    showNoSuggestionNotice:true, 
    onSelect: function (value, data) { 
     $('#countryId').val(value.data); 

    } 

}); 

यहाँ countryCache करने के लिए अपने ajax कॉल से एक नमूना है। यदि उपयोगकर्ता ने टाइप किया है, तो सर्वर ऊपर के परिणाम को वापस लौटाता है। अब जब उपयोगकर्ता I के बाद n में टाइप करता है, तो मैं सर्वर पर फिर से कॉल नहीं करना चाहता हूं। क्या कोई इसे प्राप्त करने में मेरी सहायता कर सकता है।

Answer 1

jQuery UI Autocomplete documentation में इसके लिए एक आसान समाधान है। वहां आपको शीर्षक वाला एक अनुभाग मिलेगा जिसमें कैशिंग के साथ रिमोट होगा जो दिखाता है कि आप जो खोज रहे हैं उसे कार्यान्वित करना है।

मैं इस सवाल का कि साइट से कोड अनुकूलित, और स्पष्टीकरण के लिए कुछ टिप्पणियाँ कहा:

var cache = {}; 
$("#country").autocomplete({ 
    source: function(request, response) { 
     // If the term is in the cache, use the already existing values (no server call) 
     var term = request.term; 
     if (term in cache) { 
      response(cache[ term ]); 
      return; 
     } 

     // Add countryName with the same value as the term (particular to this question) 
     // If the service reads the parameter "term" instead, this line can be deleted. 
     request.countryName = request.term; 

     // Call the server only if the value was not in the cache 
     $.getJSON("./countryCache", request, function(data, status, xhr) { 
      cache[ term ] = data; 
      response(data); 
     }); 
    }, 
    select: function (event, data) { 
     $('#countryId').val(data.item.value); 
    } 
}); 

जैसा कि मैंने पता नहीं था exaclty JSON का स्वरूप, मैं सिर्फ एक बुनियादी एक का उपयोग किया है कि के लिए "इन" टेक्स्ट लौटा: ["India","Indonesia","Spain"] (आईडी के बिना, केवल एक सादा सरणी)।

---

यदि आप उपयोग कर रहे हैं Ajax AutoComplete plugin for jQuery (कोड से ऊपर, यह की तरह लग रहा है, हालांकि सवाल jquery-ui-autocomplete के साथ टैग किया गया था), तो आप, क्योंकि प्लगइन यह स्वचालित रूप से करता है कैशिंग बारे में चिंता करने की जरूरत नहीं है आपके लिए।

प्लगइन के प्रलेखन से:

noCache: बूलियन मान का संकेत सुझाव परिणाम कैश करने के लिए है या नहीं। डिफ़ॉल्ट false।

आप nocache के लिए किसी भी मूल्य निर्दिष्ट नहीं किया है के रूप में, तो यह डिफ़ॉल्ट मान है कि है false ले जाएगा, और यह कैशिंग सीधे प्रदर्शन करेंगे।

Answer 2

मैं सब पर इस पद्धति का उपयोग नहीं और 100 की एक सीमा के साथ तेजी से, त्वरित खोज के साथ जा रहा लेकिन चूंकि मैंने पूछा, यहाँ कैसे मैं केवल पहले अक्षर का उपयोग कर अनुरोध भेजे है समाप्त हो गया:

// global variables: models [], result {} 

      lookup: function(query, done) { 

       var mdl = $("#autocomplete").val(); 
       if (mdl.length == 0) { 
        names = []; 
        result.suggestions = models; 
        done(result); 
        return; 
       } else if (mdl.length != 1) { 
        result.suggestions = names; 
        console.log(result); 
        done(result); 
        return; 
       } 

       var jqHXR = $.ajax({url: "search.php", 
         data: {"q": mdl}, 
         dataType: "json", 
         method: "GET" } 
       ) 
       .done(function(data, status, jqXHR){ 
        models = []; 
        $.each(data, function(key, val) { 
         names.push({ value: val.u, data: { category: genders[val.g] } }); 
        }); 

        result.suggestions = names; 
        done(result); 
       }) 
       .fail(function (data, status, errorThrown) { 
         console.log("failed: "+status+"| error: "+errorThrown); 
         console.log(data); 
       }); 
      }, 

Answer 3

मेरे एक सहयोगी ने डेब्रिज का इस्तेमाल किया और मेरा शोध यह सत्यापित करने के लिए प्रतीत होता है कि minChars और lookupLimit के लिए devbridgeAutocomplete ऑब्जेक्ट के लिए एक विशेषता है। हो सकता है कि devbridgeAutocomplete के विभिन्न उदाहरण हैं, लेकिन मैंने सोचा कि अगर वे समान हैं तो पोस्टिंग के लायक थे, हालांकि मुझे लगता है कि आप उन्हें पहले ही देख चुके होंगे :)।

var a = $('#<%= txtFindName.ClientID %>').devbridgeAutocomplete({ 
      minChars: 3, 
      lookupLimit: 20, 
      serviceUrl: 'AutoComplete/ADUsers.aspx', 
      onSelect: function (suggestion) { 
       $('#<%= txtTo.ClientID %>').val($('#<%= txtTo.ClientID %>').val() + ',' + suggestion.data); 
       $('#<%= txtFindName.ClientID %>').val(''); 
      } 
     });