开源项目 china_city - 中国省市区级联选择插件

saberma · 2013年08月31日 · 最后由 jxjd 回复于 2017年04月24日 · 25712 次阅读
本帖已被管理员设置为精华贴

https://github.com/saberma/china_city

简介

这是一个基于 Rails Engine 开发的插件,为 Rails 项目增加省市区三级(或者省市二级)选择框,可用于实现收货地址等信息的录入。

安装

Gemfile gem 'china_city'

app/assets/javascripts/application.js //= require 'jquery' //= require 'china_city/jquery.china_city'

config/routes.rb mount ChinaCity::Engine => '/china_city'

使用

在页面中加入选择框,示例代码使用 slim 格式

.city-group
  select.city-select
    option --省份--
    = options_for_select(ChinaCity.list)
  select.city-select
    option --城市--
  select.city-select
    option --地区--

cool,这得省多少时间啊

能和数据库关联不?

good, 最近刚好要用这个

@huacnlee 省市区的数据是从一个大的 json 获取的,不从数据库中取。

#4 楼 @saberma 既然是从 json 格式文件获取的,那自然可以很轻松地切换到远程 json 文件吧?

果断 mark 下

nice ! 代码也很 great . 特别是用 Engine 来实现,完全低耦合,也可以和其他框架集成。

👍

  • 兼容 select2 吗?

建议: 感觉区域级联的应该交给 js 来处理, 如果一定要用 rails 的话可以只给个 task 任务导出当前的省市区固定的 json 格式的文件

比如: https://code.google.com/p/tex-website/source/browse/trunk/Web/Js/LinkageSelect.js?spec=svn6&r=6

哈哈,有木有 china_college china_viewspot 。。。。

好定西。

id 不是邮编的啊

同楼上 obinn 问题 :

  1. id 用邮编
  2. 省市区的数据如何更新,即与最新的行政区划同步呢?

@Ddl1st 现在还没有试过与 select2 一定使用。

@otinn @afly 我记得区划编码是有自己的国家标准,而不是使用邮编。 会不一定期同步更新。

加上 form_helper 就更易用了,我曾经粗糙的写过一个

折腾完 rubyconf 的事情给移植过去

#8 楼 @Ddl1st 需要 select2 支持的话推荐 https://github.com/Kehao/district_cn_selector 这个项目,不过略重,作者对 ux 的需求很高

#17 楼 @saberma 行政区域编码有国标 https://github.com/huobazi/GB2260 精确到区县一级数据不多,但到村、街道办大概 要 80 多万条数据

非常棒!这个做电商系统都会用到,每个人都实现一套确实很无聊,感谢分享。

如果根据地址直接推荐出省事就更爽了

只支持 Rails4?

给力,顶一个。

几年前也做了一个纯 jquery 插件 https://github.com/hlxwell/jquery-cityselector

Good 收藏

很不错!必须赞一个!

呃。。。rails3 用不了,只能 rails4 了?

#28 楼 @Levan 现在看咱一年前的代码...那时年少懵懂啊...

早知道我就不自己找数据,然后自己弄了么。。。

@frank @Levan 现在是没有在 rails3 下测试,有需要的话我再加入 rails3 的支持。

@jasl ShopQi 已经开发过这个功能,我准备拿来用的时候,觉得还是写成 engine 好点。代码几乎没怎么改,其实还有很多优化的空间。

真心有需要…要不就只能升级到 rails4 了…工程浩大…

#33 楼 @saberma 在 Rails3 下没法用。最终只能放弃。

#36 楼 @frank #35 楼 @Levan 你们不看咱 #29 楼 的代码哇...虽然没搞成 gem rails3 的话 咱 #19 楼 推荐过一个,用的和@saberma 一样的数据源,不过作者不太遵从 rails 的哲学,但是功能上是足够了

@Levan @frank @jasl 已经同时支持 Rails3.1, 3.2 和 4.0 了

看了一下 json 没看出来树形关系,原来是用作 id 的邮编是含有关系信息的~

不过感觉要是能配置匹配数据库里的数据就更好啦。

@saberma 我是新手,我想问问,存入数据库的值是一串数,那读取显示在页面的时候,怎样才能再把数串转为汉字呢?

@saberma 我是新手,我想问问,存入数据库的值是一串数,那读取显示在页面的时候,怎样才能再把数串转为汉字呢?

#42 楼 @loddit 这个似乎是国标码

#43 楼 @gechentuo 其实你可以尝试写一个 acts_as_china_city 的小东西出来,非常简单,同时练习的元编程

@saberma 话说,如果第一级省市是北京的话,那么第二级市 就是 市辖区和县 选择 这个我和李路的讨论结果是不太友好, 你怎么看?

#47 楼 @jasl 我很想写,但是不太明白你的意思。你能具体给我说说 acts_as_china_city 这个东西是什么吗?action?

#49 楼 @gechentuo 看 readme

选择后的值为国家地区编码,如深圳市的为 440300,可通过调用 ChinaCity.get('440300') 将编码转化为城市名称。

所以,你可以通过形如 ChinaCity.get(user.district) 方式去将地区码转化成可读取的形式,通常我们也可以将它封装成 helper,如

def humanize_district(code)
    ChinaCity.get code
end

那么,能不能将 @user.dictrict 直接变成可读取的文本呢?这个就是 acts_as_的作用啦,你可以想想怎么实现他,目标是

class User
   acts_as_china_city :district
end

@user.district = '110000'
puts @user.district # => 北京市

#49 楼 @gechentuo 你可以先想,想不出来给你一个参考实现,哈哈

#50 楼 @jasl 还是给我看看你的参考吧。我不太懂 我只知道 你的代码中 acts_as_china_city 的位置,一般是 rails 给的函数,validates 之类的。我不知道怎么让自己的函数也能在 model 中用

#38 楼 @saberma 请问 form_for 下如何使用?

LZ 是不是该更新下了啊! 我怎么找不到成都高新区呢

能给个 form_for 的用法吗,为什么我加了以后不能联动.只能选择省份不能选择城市.急待解决呀!!!!!!

#56 楼 @hqjjsw520 算是 bug 吧。跟踪了下,是返回的对象中还有一个 data 包着数据在。所以取不到值。需要 hack 一下。另外,重复请求也是个问题。

不知道楼主还在不在线,现在 github 上面有 4 个 pull request 等待处理。

楼主,省市区的数据你是从哪里获取的?我查看了一下国家统计局的数据,发现你的编码将后面的街道给去掉了。 http://www.stats.gov.cn/tjsj/tjbz/tjyqhdmhcxhfdm/2013/index.html

frank 回复

我用的是 simple_form,可 work

<%= simple_form_for [:account,@user] do |f| %>
 <div class="city-group">
      <%= f.select :province,  ChinaCity.list.unshift(["--省份--", 0]), {}, class: "city-select"%>
      <%= f.select :city, ChinaCity.list(f.object.province).presence || [["--城市--", 0]], {}, class: "city-select" %>
      <%= f.select :area, ChinaCity.list(f.object.city).presence || [["--地区--", 0]], {}, class: "city-select" %>
</div>
<%= f.submit "更新资料", class: "btn btn-default" %>
<% end %>
saberma 回复

你好,我现在用您这个插件遇到个问题,我写了一个步骤的 form 表单只要加上 js : bodyTag:"fieldset"就不能够联动获取到市区两级,也不报错,后台也没有请求了

sharpx 另外一个省市区级联 gem 提及了此话题。 05月23日 19:20
需要 登录 后方可回复, 如果你还没有账号请 注册新账号