Jquery's Autocomplete

Question

के साथ क्लिक पर खोजें मैं यूट्यूब स्वत: पूर्ण खोज अनुभव अनुकरण करने की कोशिश कर रहा हूं।

जब दर्शक किसी सूचीबद्ध आइटम पर क्लिक करता है तो मुझे विकल्प नहीं मिल रहा है और स्वचालित रूप से कहा गया आइटम खोजने के लिए आगे बढ़ता है।

मेरे कोडिंग का पालन है:

<script type="text/javascript"> 
    var data = ['array1','array2']; 
    $(document).ready(function() { 
    $j("input#directorySearch").autocomplete(data); 
    }); 
</script> 

ऊपर कोड सूचीबद्ध मदों की पर क्लिक करने के उपयोगकर्ता, तथापि, यह स्वचालित रूप से खोज के बजाय खोज बॉक्स भरना होगा की अनुमति देगा।

Answer 1

मैं jQueryui के डिफ़ॉल्ट स्वत: पूर्ण विजेट का उपयोग करके समान व्यवहार चाहता था। यह चाल 'चयन' ईवेंट का उपयोग करना है, लेकिन आपके चयन-हैंडलर से सबमिट करना वांछित परिणाम नहीं देगा, क्योंकि इनपुट में अभी तक चयन नहीं होगा।

निम्न कोड मेरे लिए काम करता है हालांकि:

$("input#searchbox").autocomplete({ 
    source: autocomplete, 
    select: function(event, ui) { 
    $("input#searchbox").val(ui.item.value); 
    $("#searchform").submit(); 
    } 
}) 

कहाँ इनपुट # खोज बॉक्स वास्तविक इनपुट प्रविष्टि है (उपरोक्त उदाहरण में, 'स्वत: पूर्ण' एक यूआरएल है कि पूरा होने के स्रोत की ओर इशारा करता है), और #searchform अपनी मूल रूप है। असल में, आपको स्वयं को सबमिट करने से पहले इनपुट भरना होगा।

Answer 2

तुम सिर्फ कुछ ऐसा नहीं कर सकते:

$('.autocomplete ul li').live("click", function() { 
    $("form#search").submit(); 
}); 

कहाँ अपने विकल्प सूची पर क्लिक करें घटना एक रूप अपने खोज प्रपत्र के लिए प्रस्तुत चलाता है ?? "OnSelect:"

Answer 3

प्रारंभ में, मैं कुछ सरल ऐसे Bassistance.de रूप

मैं द्वारा devBridge

devBridge एक विकल्प कहा जाता है एक और पुस्तकालय का उपयोग कर पर चले गए प्रयोग किया जाता है जो मुझे करने की अनुमति प्रपत्र ऑटो सबमिट करें।

Answer 4

$j("input#directorySearch").result(function(event, data, formatted) { 
    $(this).closest("form").submit(); 
}); 

आधिकारिक प्रलेखन: http://docs.jquery.com/Plugins/Autocomplete/result#handler

Answer 5

$(function() { 
$("#search").autocomplete(
    { 
     source:'/search-terms.php', 
     focus: function(event, ui) { 
      $("input#search").val(ui.item.label); 
     }, 
     select: function(event, ui) { 

      $("#searchform button").click(); } 
    }) 
}); 

मैं इस ठीक काम कर रहा :)