2009-09-01 20 views
7

जैसे मैं एक स्वत: पूर्ण है कि कोई भी "सबमिट करें" बटन के लिए देख रहा हूँ, लेकिन जब स्वत: पूर्ण कीवर्ड वह एक और यूआरएल के लिए पुनः निर्देशित किया जाएगा पर उपयोगकर्ता क्लिक करें, मैंक्लिक करने योग्य स्वत: पूर्ण, गूगल

का चयन करेंगे कि कि मैं 'हूँ http://dyve.net/jquery/?autocomplete का उपयोग कर और मैं इस स्क्रिप्ट में लागू करने के लिए, किसी भी अन्य (क्योंकि अगर मैं इस एक में स्तोत्र टाइप करें, वह कोड से पता चलता है और यह भी ओडेसा) का उपयोग नहीं

उदाहरण चाहते हैं:

उपयोगकर्ता

प्रकार "goo" तब उसके लिए GOOGLE दिखाई देता है, जब वह GOOGLE पर क्लिक करता है तो स्क्रिप्ट उसे www.google.comपर भेजती है

यह बहुत अच्छा है, तो मैं सिर्फ स्क्रिप्ट के साथ कर सकता हैं मैं तुम लोगों बताया मैं एक प्रोग्रामर तो मैं तरह की जरूरत है, कोड ही है, मुझे पता है नहीं कर रहा हूँ ("Google" => "http://www.google.com" की तरह) यह पूछने के लिए बहुत कुछ है लेकिन मैंने सबकुछ कोशिश की = \

धन्यवाद!


जुई स्वत: पूर्ण में समस्या यह है कि मैं ऐसा करना चाहते हैं:

अगर मैं

यह दिखाते थे "सी स्तोत्र" और भी टाइप "स्तोत्र" "स्तोत्र एसएसए "

न केवल शुरुआत से, इसलिए मैं उस कोड को अपने अन्य

में उपयोग करने का प्रयास क्यों कर रहा हूं

भी, जब मैंने Russ और karim79 के कोड का उपयोग किया, तो यह

उत्तर

2

"पर भी काम नहीं करता" लेकिन लेखक भी यह नहीं जानते कि इसे कैसे बनाया जाए? "

मुझे लगता है कि यह संदेश-बॉक्स अलर्ट (example page में) को form.submit() के कॉल के साथ आसानी से किया जा सकता है। मैंने कोशिश नहीं की है, यद्यपि।

संपादित करें: यहाँ http://dyve.net/jquery/?autocomplete का उपयोग कर कुछ उदाहरण कोड है:

$("#mytextbox").autocomplete("form.php", {onItemSelect:submitTheForm}); 

function submitTheForm(){ 
    // redirect user to whatever URL 
} 
+0

यह मेरा पहला विचार था; लेकिन मैं जेएस या jQuery के साथ अच्छा नहीं हूँ। मुझे लगता है कि मैं कुछ याद कर रहा था। मुझे यह जानने में दिलचस्पी होगी कि क्या यह समस्या हल हो गई है। –

+0

यह काम करेगा। Jquery-autocomplete प्रोजेक्ट के लिए सही यूआरएल अब http://code.google.com/p/jquery-autocomplete – dyve

3

यहाँ एक complete walkthrough on how to build an autocomplete search है।

अनिवार्य रूप से, आप एक ईवेंट हैंडलर इंटर बटन दबाने या एक चयन पर क्लिक करने के बाद

window.location.href = "your-url-string.com"; 

कॉल करने के लिए की आवश्यकता है।

संपादित करें:

autocomplete documentation

खोज पेज रिप्लेसमेंट से

एक स्वत: पूर्ण प्लगइन अवधि के लिए खोज करने के लिए इस्तेमाल किया जा सकता है और साथ जुड़े एक पृष्ठ पर रीडायरेक्ट एक परिणामस्वरूप आइटम। के बाद एक तरह से रीडायरेक्ट प्राप्त करने के लिए है:

var data = [ {text:'Link A', url:'/page1'}, {text:'Link B', url: '/page2'} ]; 
$("...").autocomplete(data, { 
    formatItem: function(item) { 
    return item.text; 
    } 
}).result(function(event, item) { 
    location.href = item.url; // navigate to the chosen URL 
}); 
10

मैं ऐसा ही कुछ लागू किया, हालांकि, मेरी कार्यान्वयन jQuery UI Autocomplete का उपयोग करता है।

मैं एक सरल चाल, जिससे डेटा सर्वर से लौटे एक नई पंक्ति चरित्र "\ n" द्वारा अलग तार का एक सेट है का उपयोग करें, प्रत्येक पंक्ति पर वहाँ प्रारूप सुझाव :: यूआरएल साथ एक श्रृंखला है। क्लाइंट पर, मैं बस विभाजक पर विभाजित हूं (मैं :: का उपयोग करता हूं) और परिणामस्वरूप सरणी के पहले ऑफसेट से सुझाव निकालें, और दूसरे से यूआरएल निकालें। उदाहरण:

$("#search").autocomplete("/some/page", { 
     selectFirst: false, 
     formatItem: function(data, i, n, value) { 
      //make the suggestion look nice 
      return "<font color='#3399CC'>" + value.split("::")[0] + "</font>"; 
     }, 
     formatResult: function(data,value) { 
      //only show the suggestions and not the URLs in the list 
      return value.split("::")[0]; 
     } 
    }).result(function(event, data, formatted) { 
     //redirect to the URL in the string 
     var pieces = formatted.split("::"); 
     window.location.href = pieces[1]; 
    }); 

मेरा मतलब यह स्पष्ट करने के लिए, मान लीजिए कि आप 'goo' टाइप करते हैं। सर्वर वापस आ सकता है:

google::www.google.com\ngoodstuff::www.example.com 

उस उपयोगकर्ता को 'google' और 'goodstuff' के साथ एक सूची दिखाई देगी। उनमें से किसी एक पर क्लिक करने से Autocomplete की result विधि निष्पादित की जाएगी, जहां मैं बस स्ट्रिंग का URL हिस्सा लेता हूं और रीडायरेक्ट करता हूं। उम्मीद है की वो मदद करदे।

+4

क्या आप JSON वापस नहीं कर सकते हैं और फिर आप बदसूरत स्ट्रिंग विभाजन को छोड़ सकते हैं? – Martin

0

jQuery स्वत: पूर्ण प्लगइन में एक मैच है विकल्प विकल्प जो परिणाम के भीतर खोज करेगा। इसे सही पर सेट करें और यह सबस्ट्रिंग मैचों को भी वापस कर देगा।

1

निम्नलिखित कोड एक खोज फ़ील्ड में एक दूरस्थ डेटा स्रोत (MySQL डेटाबेस) और एक पुनर्निर्देशक पर डेटा के साथ एक खोज बॉक्स मोड़ के लिए मेरे लिए ठीक काम करता है एक उपयोगकर्ता सुझाये गये परिणामों में से एक का चयन करता है, तो:

$("#search").autocomplete("search.php", { 
    width: 260, 
    formatItem: function(data) { 
      return data[0]; 
      } 
     }).result(function(event, data) { 
    window.location.href = data[1]; 
}); 

ध्यान दें:

  1. खोज पद
  2. यूआरएल है कि शब्द
से संबंधित: मैं दो भागों में विभाजित ajax डेटा करना था

उदाहरण के लिए।

ब्रैड पिट |/अभिनेता/Bradpitt

मैट डैमन |/अभिनेता/mattdamon

jQuery स्वत: पूर्ण स्वचालित रूप से पाइप में डेटा को अलग करती है (|) और नई लाइन

0

सबसे सरल उदाहरण आप कर सकते हैं प्रति JSFiddle

var data = [ 
    { 
     value: 'Google', 
     url: 'http://www.google.com' 
    }, 
    { 
     value: 'StackOverflow', 
     url: 'http://www.stackoverflow.com' 
    } 
]; 

$("input").autocomplete({ 
    source: data, 
    select: function(event, ui) { 
     window.location = ui.item.url; 
    } 
}); 
संबंधित मुद्दे