2012-01-30 102 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