2008-10-11 17 views
9

मैं रेल एप्लिकेशन में टेक्स्ट एंट्री फ़ील्ड के लिए "सुझाव" सुविधा को कार्यान्वित करने का सबसे आसान तरीका ढूंढ रहा हूं। विचार डेटाबेस कॉलम में संग्रहीत नामों को पूरा करना है, जिससे उपयोगकर्ता संभावित मिलानों के ड्रॉप-डाउन मेनू को टाइप करते हैं।टेक्स्टबॉक्स के लिए "सुझाव" सुविधा

किसी भी सुझाव के लिए धन्यवाद!

उत्तर

5

रेल पर रूबी Prototype framework उपलब्ध है। इस ढांचे का उपयोग Script.aculo.us द्वारा किया जाता है और यह autocompleter control प्रदान करता है जो आप जिस कार्यक्षमता की तलाश कर रहे हैं उसे प्रदान कर सकते हैं।

1

संपादित करें: मैं सैद्धांतिक संदर्भ बिंदु के एक प्रकार के रूप में यहाँ इस उत्तर छोड़ देंगे, लेकिन यह लग रहा है जैसे आप autocompleter answer :)

अस्वीकरण के लिए अधिक उपयोगी होने की संभावना है: हालांकि मैं गूगल के लिए काम (जो स्पष्ट रूप से विभिन्न यूआई में तत्वों को "सुझाव" है) मैंने इस क्षेत्र के आसपास के किसी भी कोड को नहीं देखा है, न ही क्लाइंट-साइड पहलू के बारे में किसी से भी बात की है।

सर्वर-साइड भाषा शायद यहां अप्रासंगिक है। क्लाइंट साइड पर AJAX आवश्यक महत्वपूर्ण बात है।

मेरा सुझाव है कि आपके पास लगभग 1 सेकंड का टाइमर है (एक मीठा स्थान खोजने के लिए प्रयोग) जो प्रत्येक बार जब उपयोगकर्ता टेक्स्टबॉक्स में कीस्ट्रोक में प्रवेश करता है और रद्द कर देता है तो उपयोगकर्ता टेक्स्टबॉक्स से दूर हो जाता है। अगर टाइमर आग लगती है, तो इसे एजेक्स अनुरोध को आग लगाना। AJAX अनुरोध में उपयोगकर्ता ने अब तक टाइप किया है। AJAX प्रतिक्रिया सुझावों और मूल अनुरोध पाठ की सूची होना चाहिए।

यदि, जब AJAX प्रतिक्रिया लौटाती है, तो टेक्स्टबॉक्स में टेक्स्ट अभी भी प्रतिक्रिया में फ़ील्ड जैसा होता है (यानी उपयोगकर्ता ने तब से टाइप नहीं किया है) और यदि टेक्स्टबॉक्स अभी भी केंद्रित है, तो ड्रॉपडाउन प्रदान करें। (चीजों के इस पक्ष को करने के लिए HTML comboboxes के बारे में सैकड़ों उदाहरण पृष्ठ होना चाहिए।)

सभी सर्वर को जांच करने और उचित रूप से प्रतिक्रिया को स्वरूपित करके AJAX अनुरोध का जवाब देना है - यह बहुत आसान है ग्राहक पक्ष!

आशा है कि मदद करता है - कोई नमूना कोड नहीं है, लेकिन मुझे संदेह है कि यह काफी शामिल है और मैं वास्तव में एक जावास्क्रिप्ट डेवलपर नहीं हूं।

1

रेल में अधिकांश चीजों के साथ ऐसा करने के कई तरीके हैं। रेल का उपयोग ऑटो-पूर्णता सहायकों का एक सेट शामिल करने के लिए किया जाता था, लेकिन उस कार्यक्षमता को अब auto_complete प्लगइन में हटा दिया गया है। यह संभवतः आपके द्वारा कार्यान्वित किए जाने वाले कार्यों को प्राप्त करने का सबसे आसान तरीका है - नियंत्रक में एक साधारण कमांड, आपके विचार में कुछ साधारण चीजें - टा-दाह। इस समाधान का उपयोग करने के लिए आपको बस अपने ऐप में प्लगइन स्थापित करने की आवश्यकता होगी - this page देखें जो आपको इंस्टॉल करने और शुरू करने के लिए आपको यह जानने की ज़रूरत है।

जैसा कि एक और उत्तर में बताया गया है, इस मार्ग पर जाने से प्रोटोटाइप और शानदार AJAX ढांचे का उपयोग किया जाएगा जो रेल के साथ बंडल किए जाते हैं। अन्य AJAX फ्रेमवर्क हैं, विशेष रूप से JQuery, जो आपको इस कार्यक्षमता को पूरा करने में भी मदद कर सकते हैं, लेकिन प्लगइन के साथ जाने के बजाय आप उनका उपयोग करने के लिए और अधिक रैंप-अप सीखेंगे। पाठ फ़ील्ड वास्तव में आसान text_field_with_auto_complete विधि का उपयोग पर 'suggest' शैली स्वत: पूर्ण

1

आप भी इस से थोड़ा अधिक मैनुअल दृष्टिकोण

# your_view.rhtml 

<%= text_field 'contact', 'name', :id => 'suggest' %> 
<div id='dropdown' style='display:none; z-index: 100; background: #FFFFFF'></div> 

<script> 
    new Ajax.Autocompleter('suggest', 'dropdown', "<%= url_for :controller => 'contacts', :action => 'suggest_name' %>") 
</script> 

# contacts_controller.rb 

def suggest_name 
    query_string = params[:contact][:name] 
    @contacts = Contact.find.all :conditions => ['name ilike ?', "%#{query_string}%"] 
    render :partial => 'name_suggestions' 
end 

# contacts/_name_suggestions.rhtml 

<ul> 
<% for contact in @contacts %> 
    <li><%= contact.name %></li> 
<% end %> 
</ul> 
8

रेल बनाता है की कोशिश कर सकते हैं।

रेल 1 में।x इस विधि को ActionView::Helpers::JavaScriptMacrosHelper में बनाया गया था, लेकिन रेल 2.x के लिए इसे a separate plugin पर ले जाया गया था।

मान लें कि आपके पास Post नामक एक मॉडल है जिसमें title नामक टेक्स्ट फ़ील्ड है।

class PostsController < ApplicationController 
    auto_complete_for :post, :title 
end 

इस क्या करता है: एक इसी घोषणा करने

<%= text_field_with_auto_complete :post, :title %> 

साथ ही, PostsController में, आप है आपके विचार, जहां आमतौर text_field_tag (या f.text_field) का प्रयोग करेंगे में, बस text_field_with_auto_complete बजाय का उपयोग दृश्यों के पीछे गतिशील रूप से नियंत्रक को auto_complete_for_[object]_[method] नामक एक क्रिया जोड़ें। उपर्युक्त उदाहरण में इस क्रिया को auto_complete_for_post_title कहा जाएगा।

यह उनका कहना है कि इस स्वत: जनरेट कार्रवाई के द्वारा प्रयोग किया find कॉल भर में सभी मॉडल वस्तुओं में कार्य करेगा लायक है, उदाहरण के लिए Post.find(:all, ...)। यदि यह वह व्यवहार नहीं है जिसे आप चाहते हैं (उदाहरण के लिए, यदि लॉग इन उपयोगकर्ता के आधार पर Post एस के विशिष्ट उप-समूह में खोज को प्रतिबंधित करना चाहते हैं) तो आपको अपने नियंत्रक में अपनी auto_complete_for_[object]_[method] कार्रवाई को परिभाषित करना होगा।

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