jQuery कॉलबैक (लेबल/वैल्यू जोड़ी) का उपयोग कर स्वत: पूर्ण

मैं स्वत: पूर्ण jQuery को कार्यान्वित करने की कोशिश कर रहा हूं, लेकिन autocomplete फ़ंक्शन को समझ नहीं रहा हूं जो jQuery UI प्रदान करता है।jQuery कॉलबैक (लेबल/वैल्यू जोड़ी) का उपयोग कर स्वत: पूर्ण

यह कॉलबैक फ़ंक्शन का उपयोग करता है और एक लेबल/मूल्य जोड़ी के रूप में प्रतिक्रिया प्राप्त करता है। मेरे पास कुछ नमूना कोड है जहां मैं एक मनमानी लेबल/मूल्य जोड़ी वापस पास करने की कोशिश कर रहा हूं और उस विकल्प को प्रदर्शित करता हूं लेकिन यह काम नहीं कर रहा है। अगर कोई मेरी मदद कर सकता है या मुझे एक साधारण कार्यक्रम दिखा सकता है तो यह बहुत अच्छा होगा।

http://jsfiddle.net/kB25J/

HTML:

<html> 
    <body> 
     Please enter your country name 
     <input id ="book" type="text" value=""> 
    </body> 
</html>

जावास्क्रिप्ट:

$("#book").autocomplete({ 
    source: function(request, response) { 
     alert(request.term); 
     response(function() { 
      return { 
       label: "hi", 
       value: "bye" 
      } 
     }); 
     alert(reponse); 
    } 
});

धन्यवाद

स्रोत

2012-09-19 Lakshmikanthan Vijayaraghavan

\t \t अपने देश का नाम दर्ज करें । \t –

मैंने टिप्पणियों से अपना कोड जोड़ा। टिप्पणियों में कोड जोड़ने की बजाय आप कोई भी प्रासंगिक कोड जोड़ने के लिए अपनी पोस्ट संपादित कर सकते हैं :) – Nope

हाय फ्रेंकोइस धन्यवाद, मैं कोड –

जब जवाब भेजने से, समारोह के बजाय एक सरणी गुजरती हैं।

$(function() { 
    $("#book").autocomplete({   
     source: function(request, response) { 
      var data = [{ 
        label: "hi", 
        value: "bye" 
        }]; 
      response(data); 
     }, 
     select: function(event, ui) { 
      $("#book").val(ui.item.label); //ui.item is your object from the array 
      return false; 
     } 
    }); 
});

स्रोत

2012-09-19 15:07:53 prashanth

हाय प्रशांत कोड काम करता है लेकिन प्रतिक्रिया (डेटा) क्या करना चाहिए? –

'प्रतिक्रिया' कॉलबैक फ़ंक्शन है जिसे आप पैरामीटर के रूप में अपने डेटा से कॉल करते हैं। प्रतिक्रिया() पैरामीटर के रूप में एक सरणी की अपेक्षा करता है। यह सरणी या तो एक साधारण सरणी हो सकती है (जैसे ['a', 'b']) या 'लेबल' और 'मान' गुणों के साथ ऑब्जेक्ट्स की सरणी (जैसे [{लेबल: 'वीए', मान: 'वर्जीनिया'} , {लेबल: 'सीए', मान: 'कैलिफोर्निया'}]) – prashanth

हाय प्रशांत क्या यह इस मामले में "हाय" के सुझावों के साथ मेरे टेक्स्ट बॉक्स के बगल में एक बूंद नीचे प्रदर्शित होगा? –

आप अपने स्रोत में एक सरणी लौट जाना चाहिए, भले ही इसकी सिर्फ 1 मैच इस मामले में 'हाय'/'अलविदा'

के रूप में पर jqueryui.com लेबल/मूल्य के लिए कुंजी/मान जोड़े की एक सरणी लौटने दूरस्थ प्रतिक्रिया पर एक मानचित्र का उपयोग

response($.map(data.geonames, function(item) { 
    return { 
     label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName, 
     value: item.name 
    } 
}));

इसका इस उदाहरण में देखा।

यदि आपका स्रोत केवल देशों की एक सूची है तो आप केवल अपने स्रोत के रूप में तारों की एक सरणी का उपयोग कर सकते हैं।

var countries = ["USA", "Canada", "Mexico", ...] 

$('input').autocomplete({ 
    source : countries 
});

आप किसी दूरस्थ स्रोत के साथ काम कर रहे हैं:

$('input').autocomplete({ 
    source : function (request, response) { 
     $.ajax({ 
      url: "url_to_get_countries", 
      dataType: "json", 
      success: function(data) { 
      response($.map(data.countries, function(item) { 
      return { 
       label: item.country_name, 
       value: item.country_id 
      } 
      })); 
      } 
     }); 
    } 
});

स्रोत

2012-09-19 14:40:01 Mark

हाय मार्क क्या आप मुझे कुछ कोड दे सकते हैं, जैसे मैंने कहा कि मैं वास्तव में जे क्वेरी साइट पर विवरण से स्वत: पूर्ण काम नहीं कर रहा हूं। कृपया मुझे बताएं कि सुझावों के साथ उत्पन्न किया गया div स्वचालित रूप से जेनरेट किया गया है या नहीं? –

@ लक्ष्मीकांतन विजयाराघवन क्या आप रिमोट डेटा स्रोत के साथ काम कर रहे हैं? आप स्वत: पूर्ण के लिए अपनी सूची कहां से प्राप्त कर रहे हैं, मैं आपको जो भी डेटा स्रोत के साथ काम कर रहा हूं उसके साथ एक उदाहरण दिखा सकता हूं। – Mark

हाय मार्क मैं उन देशों के लिए स्वत: प्रेषित करने वाला हूं, मुझे लगता है कि डीबी को यहां से एक्सेस नहीं किया जा सकता है।वास्तव में मैं लेबल मूल्य जोड़ी –

@LakshmikanthanVijayaraghavan

आप Autocomplete guide पर देख सकते हैं, वहाँ jQuery प्लगइन के साथ स्वत: पूर्ण लागू करने के लिए तीन तरीके हैं।

वस्तु सरणी

पहले दो विकल्पों के लिए कर रहे हैं पाने के लिए एक यूआरएल प्रदान करना मान

whith जोड़े मूल्य/लेबल

वस्तुओं की एक सरणी प्रदान की सूची के साथ एक सरणी प्रदान करना मूल्यों की एक निश्चित सूची। यदि आप स्वत: पूर्ण सूची को द्विपक्षीय रूप से पॉप्युलेट करना चाहते हैं, तो आपको अंतिम को लागू करना होगा।

ऐसा करने के लिए, आपको ऑब्जेक्ट सरणी प्राप्त करने के लिए एक यूआरएल निर्दिष्ट करना होगा। यदि आप लेबल और कुंजी को छिपाना चाहते हैं, तो आपको एक इनपुट प्रकार छिपाना होगा और उसका मान भी सेट करना होगा।

उदाहरण

$("#book").autocomplete({ 
      source: "getValues.htm",      
      select: function(event, ui) { 
       $("#book").val(ui.item.label); 
       $("#book_hidden").val(ui.item.value); 
       return false; 
      }       
     });

getValues.html लेबल/मान जोड़ी की सरणी लौटना चाहिए के लिए

।

आशा इस मदद करता है

स्रोत

2012-09-19 15:02:04 Tux9R

हाय टक्स क्या यह मेरे लिए संभव है इस उदाहरण jsfiddle.net/kB25J/3 के साथ चयन करें। –

हाय, मैंने http://jsfiddle.net/kB25J/4/ पर अपना कोड अपडेट कर लिया है। जैसा कि आप देख सकते हैं, मैंने स्वत: पूर्ण तत्व के बाहर डेटा सरणी परिभाषित की है। मुझे लगता है (लेकिन यकीन नहीं है) कि यदि आप स्वत: पूर्ण "स्रोत" विकल्प में डेटा की सरणी परिभाषित करते हैं, तो हर बार जब आप पूरी सरणी वापस करने जा रहे हैं। मैंने स्टोर को मूल्य में भी एक इनपुट शामिल किया है, जब आप कोई तत्व चुनते हैं तो वह भर जाता है। याद रखें कि हमेशा आप लेबल का चयन करते हैं, मूल्य नहीं। यदि आप मान का चयन करना चाहते हैं, तो आपको "चयन" व्यवहार बदलना होगा। पीडी। क्षमा करें, मैंने परिवर्तनों को सहेज नहीं लिया :(, मैं फिर से संपादित करने जा रहा हूं :) – Tux9R

ठीक है, मुझे लगता है कि यह सही लिंक है -> http://jsfiddle.net/kB25J/5/ – Tux9R

अजाक्स, कुंजी मूल्य जोड़ी, खोज को ट्रिगर करने के लिए न्यूनतम लंबाई। सरल कोड

<script> 
    $(function() { 
     $("#CompanySearch").autocomplete({ 
      source: function (request, response) { 
       $.ajax({ 
        url: '/Admin/GetCompanyAutoComplete', 
        dataType: "json", 
        data: { term: request.term }, 
        success: function (data) { 
         response(data); 
        } 
       }); 
      }, 
      minLength: 2 
     }); 
    }); 
</script>

अधिक

https://stackoverflow.com/a/40883309/5237614

स्रोत

2016-11-30 08:27:41

यह सबसे अच्छा समाधान है। – dalmate

@Edathadan आपकी प्रतिक्रिया के लिए सबसे अच्छा समाधान है। लेकिन, मुझे लगता है कि हम मूल अनुरोध रखने की जरूरत है, तो आप संशोधित करना चाहिए रहे हैं:

<script> 
    $(function() { 
     $("#CompanySearch").autocomplete({ 
      source: function (request, response) { 
       $.ajax({ 
        url: '/Admin/GetCompanyAutoComplete?term=' + request.term, 
        dataType: "json", 
        success: function (data) { 
         response(data); 
        } 
       }); 
      }, 
      minLength: 2 
     }); 
    }); 
</script>

स्रोत

2017-11-23 04:15:18 dalmate

jQuery कॉलबैक (लेबल/वैल्यू जोड़ी) का उपयोग कर स्वत: पूर्ण

उत्तर

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