ClwyChinaCity 省市区街道级联选择
说明
Fork 自saberma/china_city,原始项目年久失修,无法使用。修复为兼容 Rails 6。
简介
这是一个基于 Rails Engine 开发的插件,为 Rails 项目增加省市区街道四级(或者省市区三级、省市二级)选择框,可用于实现收货地址等信息的录入。
数据来源
安装
Gemfile
gem 'clwy_china_city'
app/assets/javascripts/application.js
//= require 'jquery'
//= require 'clwy_china_city/jquery.clwy_china_city'
config/routes.rb
mount ClwyChinaCity::Engine => '/clwy_china_city'
使用
可以参考 https://github.com/saberma/china_city_example 示例代码。
在页面中加入选择框,示例代码使用 slim 格式
.city-group
select.city-select
option --省份--
= options_for_select(ClwyChinaCity.list)
select.city-select
option --城市--
select.city-select
option --地区--
select.city-select
option --街道--
请留意:所有选择框都要有 city-select
class,并都包含于 class='city-group' 的 DOM 元素之下。
选择后的值为国家地区编码,如深圳市的为 440300
,可通过调用 ClwyChinaCity.get('440300')
将编码转化为城市名称。
React 用户 react-china-city
如果你使用 React 和 webpack/browserify 可以直接使用 npm i react-china-city --save
来进行前端接入。
更新
- 0.0.5 更新省市区数据到最新的国标,支持街道