क्या आप jQuery UI स्वत: पूर्ण combobox के साथ अमान्य कीस्ट्रोक दर्ज करना प्रतिबंधित कर सकते हैं?

Question

the jQuery UI autocompletecombobox का उपयोग करते समय, मुझे लगता है कि सूची के आधार पर केवल वैध कुंजी प्रविष्टि को बल देने का विकल्प होगा। क्या अमान्य कुंजी की अनुमति न देने का कोई तरीका है, इसलिए आप केवल सूची में मान्य आइटम दर्ज कर सकते हैं? साथ ही, combobox का डिफ़ॉल्ट मान सेट करने का कोई तरीका है?

मेरी सूची में है, तो (सी #, जावा, पायथन)

मैं लिखना प्रारंभ कर सकते "abcds।।" और यह मुझे इसे टाइप करने देता है। मुझे केवल वैध प्रविष्टियों की अनुमति है।

Answer 1

अपडेट 2

Tested on 
Internet Explorer 6 and later 
Chrome 
Firefox 
Opera 

डेमो:http://so.devilmaycode.it/can-you-restrict-entering-invalid-keystrokes-with-jquery-ui-autocomplete-combobox

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

var Tags = ['csharp', 'java', 'python' ]; 

    $("#autocomplete").keypress(function(event) { 
     //Firefox workaround.. 
     if (!event.which && 
      ((event.charCode || event.charCode === 0) ? event.charCode: event.keyCode)) { 

      event.which = event.charCode || event.keyCode; 
     } 
     var charCode = String.fromCharCode(event.which).toLowerCase(); 
     var search_val = this.value + charCode; 
     var x = search_val.length - 1; 
     var match; 
     for (var i = 0; i < Tags.length; i++) { 
      if (charCode == Tags[i][x] && Tags[i].indexOf(search_val) != -1) { 
       match = true; 
      } 
     } 
     //Backspace functionality added! 
     if (!match && event.which != 8) { 
      event.preventDefault(); 
     } 
    }); 

नोट:

1. बल ही मान्य कुंजी प्रविष्टि सूची के आधार पर;
2. डिफ़ॉल्ट मान सेट करें;
3. हल्के कार्यान्वयन ;-)

मुझे पता करते हैं!

Answer 2

आपका प्रश्न jQuery plugin forum पर How to implement “mustMatch” and “selectFirst” in jQuery UI Autocomplete पर भी एक आम अनुरोध प्रतीत होता है। लोग इस मुद्दे पर चर्चा कर रहे हैं।

इस प्रश्न के लिए accepted answer काम करता है। तो Doc Hoffiday का समाधान वास्तव में प्रतिष्ठा अंक के पात्र है।

वैकल्पिक रूप से आप Jörn Zaefferer's autocomplete का उपयोग कर सकते हैं "mustMatch" विकल्प के साथ।

<script type="text/javascript"> 
$(document).ready(function(){ 
    var availableTags = ["csharp", "java", "python"]; 
    $("#tags").autocomplete(availableTags, { 
     mustMatch: true 
    }); 
}); 
</script> 

<input id="tags" /> 

अद्यतन

शुरू में, मैंने छोड़ दिया है कि आप एक बता गया समाधान चाहता था। यह स्पष्ट करने के लिए धन्यवाद।

I have tweaked the combobox example.

मैं यह वास्तव में एक फार्म के भीतर काम करने के लिए कुछ परिवर्तन करने की जरूरत है। मैंने यह सुनिश्चित करने में थोड़ी देर दे दी कि घटनाएं सही क्रम में हुईं। इसके अलावा मैंने डॉक्टर हॉफिडे के समाधान को डाला।

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

अद्यतन 2

मैं इतना है कि दर्ज किया गया टेक्स्ट ओवरराइट नहीं है जब यह मान्य विकल्प की शुरुआत से मेल खाता है डॉक्टर Hoffiday के समाधान के आधार पर एक नए कस्टम चयनकर्ता गयी। मैंने इसे भी अपडेट किया है ताकि स्रोत अधिक सटीक मिलानों के लिए प्रस्तावित विकल्पों को प्रतिबंधित कर सके। मुझे आशा है कि यह आपकी आवश्यकताओं के करीब है।

I have tweaked my previous combobox example.

Answer 3

अपना स्वत: पूर्ण सेट अप करने के बाद, स्पेस कैरेक्टर को रोकने और चरित्र (ASCII कोड 32 और 61) के बराबर करने के लिए इस कोड का उपयोग करें। और एक डिफ़ॉल्ट सेट करने के लिए;

 $("#myautocompletectrl").keypress(function (e) { 
     if (e.which == 32 | e.which == 61) { 
      e.preventDefault(); 
     } 
    }).val('mydefaultvalue'); 

यह काम करता है जैसे कुंजी कभी दबाया नहीं गया था (जैसा कि आप कहते हैं)।

फ़ायरफ़ॉक्स 3.63 और jQuery UI 1.8 स्वत: पूर्ण पर परीक्षण किया गया।

इसके अलावा, अगर आप पाते हैं कि आप अतिरिक्त jQuery यूआई 1.8 स्वत: पूर्ण में mustMatch कार्यक्षमता लागू करना चाहते हैं, तो यहाँ देखो: How to implement "mustMatch" and "selectFirst" in jQuery UI Autocomplete?

संपादित करें: मैं देख रहा हूँ आप पहले से ही पढ़ सकते हैं और अपनी पोस्ट पर टिप्पणी की है .... :)

Answer 4

$("#myautocompletectrl").keypress(function (e) { 
    if (e.which == 32 | e.which == 61) { 
     e.preventDefault(); 
    } 
}).val('mydefaultvalue'); 

यह मेरे लिए काम करता ... youuu धन्यवाद: डी