2011-10-11 25 views
25

मैं मेनू से किसी आइटम का चयन करते समय एक फॉर्म सबमिट करने का प्रयास कर रहा हूं। मैं खोज फार्म पर वर्ग की स्थापना की और मैं घटना इसके लिए चयन यहाँ पाया जाता है जो उपयोग कर रहा हूँ: http://docs.jquery.com/UI/Autocomplete#event-selectjQuery स्वत: पूर्ण: घटना-चयन

अब, जब आप एक आइटम कुंजीपटल (ऊपर और नीचे) का उपयोग कर का चयन करें, यह काम करता है। लेकिन यदि आप माउस का उपयोग करके कोई आइटम चुनते हैं, तो यह आपको वह मान देता है जो पहले टाइप किया गया था।

चेक इस screenr:

$("#searchform-input").autocomplete({ 
    select: function (a, b) { 
     $(".searchform1").submit() 
    } 
}); 

उत्तर

63

इसका कारण यह है select घटना का डिफ़ॉल्ट व्यवहार after your event handler is finished running निष्पादित किया जाता है (ताकि आप इसे रद्द कर सकते हैं अगर आपने ऐसा चुना: http://www.screenr.com/7T0s

यह है कि मैं क्या प्रस्तुत करने के लिए उपयोग करें)।

इसका मतलब है कि जब आप कुछ क्लिक करते हैं, तो विजेट को input को ठीक से पॉप्युलेट करने का मौका मिलने से पहले आपका फॉर्म सबमिट किया जाता है।

आप क्या विजेट सामान्य रूप से आप के लिए करता है इसका समाधान करने में सक्षम होना चाहिए:

$("#searchform-input").autocomplete({ 
    select: function (a, b) { 
     $(this).val(b.item.value); 
     $(".searchform1").submit() 
    } 
}); 

अब, क्या आप सोच हो सकती है हां में है, लेकिन क्यों यह काम करता है जब मैं कुंजीपटल का उपयोग करें?

यह इसलिए होता है क्योंकि focus घटना वास्तव में input में फ़ोकस किए गए आइटम भरता है (करीब से देखो, तुम input आबादी के रूप में आप ऊपर और सूची नीचे ले जाने देखेंगे)। जब आप किसी आइटम को माउसवर करते हैं, तो focus ईवेंट को input पर पॉप्युलेट किया जाता है। जब आप enter कुंजी का उपयोग करके कुछ चुनते हैं, तो ईवेंट की वजह से सही मान input में होता है।

+2

+1 मुझे यह करने के लिए मारो ... बाहर की कोशिश [इस डेमो] (http://jsfiddle.net/Mottie/SmycH/) – Mottie

+0

अतुल्य! बहुत बहुत धन्यवाद सर – jQuerybeast

+0

@jQuerybeast: कोई समस्या नहीं! –

-2

हेहे। काफी मुश्किल है, लेकिन हल करने के लिए अविश्वसनीय रूप से सरल है। चयन घटना के बाद बस 500 मिलीसेकंड समारोह में देरी करें। यह पूरी तरह से काम करता है। काम हो गया!! :)

$("#searchform-input").autocomplete({ 
select: function (a, b) { 
    setTimeout(submit,500); 
}}); 
+2

वास्तविक समाधान होने पर समय पर भरोसा न करें। –

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