iT邦幫忙

2017 iT 邦幫忙鐵人賽
DAY 27
1
Modern Web

Ruby礦工的Rails地圖系列 第 27

實用Gem 介紹:taiwan_city

現在是倒數第四天
關於rails本身的介紹,實在是到了想不到梗的程度
於是乎我決定來介紹一下我認為實用的Gem
也算是造福台灣地區的工程師

相信很多台灣的專案可能都會有這樣的需求
需要做縣市地址的二階下拉選單
例如選擇台北市,第二個下拉選單依序出現:中正區、中山區、文山區等等...
這樣的需求還挺普遍的
基於不需要重複造輪的精神
已經有人將這個需求寫成了一個方便的Gem
供大家快速使用

github位置

Gemfile

gem 'taiwan_city'

app/assets/javascripts/application.js

//= require 'jquery'
//= require 'taiwan_city/jquery.taiwan_city'

實務上不一定要放在application.js
但是有使用到的頁面前,一定要載入
反之,如果需要的頁面沒有載入application.js
就需要在該頁面前的js階段載入這兩行

config/routes.rb

mount TaiwanCity::Engine => '/taiwan_city'

可以加在最下方
但避免有同名的taiwan_city路徑
如果放在上方可能會被覆蓋掉而失效

view (html)階段

如果上述都設定完成
跑完bundle就可以使用啦
以slim頁面為例:

.city-group
  select.city-select
    option --縣市--
    = options_for_select(TaiwanCity.list)
  select.city-select
    option --鄉鎮市區--

特別注意,外層需要用<div class="city-group"></div>所包圍
裡面兩個縣市與區域的selecter需要有class="city-select"
然後縣市的選項下載入gem所導入的helper方法:options_for_select(TaiwanCity.list)
如此就生效囉

存取時會存入五碼數字
前兩碼為專案定義的縣市代碼,後三碼為郵遞區號
例如台北市中正區為01100
其中01為台北市,100為中正區的郵遞區號
要從五碼轉為縣市或區域名稱字串方法如下:

> TaiwanCity.get('01100')
=> "中正區"
> TaiwanCity.get('01000')
=> "台北市"

認真要說的話
目前這個專案還有幾個需要注意的地方
首先是沒有支援語言包,這部分有點可惜
我有時間可能會送PR

另一部分是因為基於郵遞區號編碼
所以郵遞區號相同的部分沒有分別的選項
例如:
新竹市的東區、北區、香山區都是300
雖然這點對於工程師而言
結果都是正確的
但是使用者有可能會回報沒有正確的對應選項
在這專案當中會變成需要選擇
「新竹縣05000」->「新竹市05300」
沒有更細的選項了

原本嘉義市也有類似的問題
不過我已經修正了(送出PR被接受)
各為如果使用Gem有什麼改進建議
也可以嘗試送出PR,一起讓Gem更完善唷!
新年快樂!!!


上一篇
新年快樂之準備跨年以前的一些Rails命令列提醒
下一篇
實用Gem介紹:i18n-js
系列文
Ruby礦工的Rails地圖30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言