2012-01-30 96 views
6

林尋找一個良好的jQuery插件,可以處理 找到一個城市所屬的國家(與自動完成型)軌道/ jQuery的自動完成自動完成插件城市,國家

例如:

Typing "New Yor" 

應該自動完成

New York, United States 

而且能夠在城市和鄉村保存爲

:city 
:country 

什麼是實現這種功能的好方法?我的意思是在用戶數據庫中存儲所有國家和城市的更多信息。我知道https://github.com/jim/carmen,但那個正在被重寫,我很想自己弄清楚這個,有一點幫助。

回答

8

還不如寫自己的邏輯,這一點,因爲我不認爲做一個插件是要提出自己:

我假設城市和國家有ID。如果沒有,邏輯實際上會更簡單。 使用jQueryUI的自動完成爲您的元素觸發自動完成。添加一個控制器方法,該方法會將您的城市和國家/地區標籤(可能是城市對象上的方法)與您的ID一起作爲json。在自動填充「選擇」回調中,爲城市和國家ID在表單中設置隱藏字段。這最後一部分是可選的,因爲我不知道你打算如何從表單中保存這些數據。

下面的例子假設你的應用很多,但應該足以讓你開始:

的視圖腳本的

例如:

$("#yourField").autocomplete({ 
     source: "/path_to_your_action", 
     minLength: 2, 
     select: function(event, ui) { 
     $(this).val(ui.item.label); 
     $(this).find("#country_id").val(ui.item.country_id); 
     $(this).find("#city_id").val(ui.item.city_id); 
     event.preventDefault; 
     } 
    }) 

控制器:

def your_action 
    term = params[:term] 
    cities = City.where("cities.name like ?", "%#{term}%") 
    .limit(25) 
    .all 
    render :json=>cities.collect{|c| {:label=>c.your_label_method, :city_id=>c.id, :country_id=>c.country_id}} 
end 

city.rb

def your_label_method 
    "#{self.name}, #{self.country.name)}" 
end 
+0

有一個很好的方式在這個正確的方向,thx! – Rubytastic 2012-02-03 15:42:20

0

就你而言,更好的解決方案是使用谷歌地圖api知道一個好的回報。您可以通過示例使用插件htp://github.com/sgruhier/jquery-addresspicker。

+0

謝謝我研究這個問題,留下問題打開一些更多的迴應這可能只適用於一些修改問題是你然後無法控制返回的值。美國而不是美國。我更喜歡使用本國數據庫的本地解決方案。 thx雖然用於指出寶石 – Rubytastic 2012-01-30 16:15:11