# 郵便番号⇒住所（2か所）

**URL:** <https://community.cybozu.dev/t/topic/4081>\
**Category:** kintone 開発相談\
**Created:** [2019 年 6 月 10 日午前 2:58 UTC](https://community.cybozu.dev/t/topic/4081 "2019-06-10T02:58:30Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![Legacy\_Account1031](https://avatars.discourse-cdn.com/v4/letter/l/eb8c5e/32.png) [@Legacy\_Account1031](https://community.cybozu.dev/u/Legacy_Account1031)\
**Post date:** [2019 年 6 月 10 日午前 2:58 UTC](https://community.cybozu.dev/t/topic/4081/1 "2019-06-10T02:58:30Z")

</div>

郵便番号から住所を自動で転記できるJavascriptは公開されている通りですが、1個のフォームに2回郵便番号を入力するケースで、こちらの実装は可能でしょうか？

友達の紹介キャンペーンなどで、本人住所と紹介した友達の住所を入力する必要があり、どちらも自動で転記されるようにしたいです。

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1051](https://avatars.discourse-cdn.com/v4/letter/l/9de053/32.png) [@Legacy\_Account1051](https://community.cybozu.dev/u/Legacy_Account1051)\
**Post date:** [2019 年 6 月 11 日午前 4:03 UTC](https://community.cybozu.dev/t/topic/4081/2 "2019-06-11T04:03:56Z")

</div>

promiseなどの非同期処理を使って二回APIを叩けば可能だと思います！

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1031](https://avatars.discourse-cdn.com/v4/letter/l/eb8c5e/32.png) [@Legacy\_Account1031](https://community.cybozu.dev/u/Legacy_Account1031)\
**Post date:** [2019 年 6 月 11 日午前 4:07 UTC](https://community.cybozu.dev/t/topic/4081/3 "2019-06-11T04:07:59Z")

</div>

コメントありがとうございます。

また、方法のご提供ありがとうございました。

勉強してみます。

---

<div class="post-metadata">

**Author:** ![Legacy\_Account795](https://avatars.discourse-cdn.com/v4/letter/l/94ad74/32.png) [@Legacy\_Account795](https://community.cybozu.dev/u/Legacy_Account795)\
**Post date:** [2019 年 6 月 12 日午前 9:29 UTC](https://community.cybozu.dev/t/topic/4081/4 "2019-06-12T09:29:36Z")

</div>

お世話になっております。

cstapの友利と申します。

以下のjavascriptを読み込むこむことで2回郵便番号を入力するケースに対応できます。

この時２つ目の住所を記入する欄のフィールドのフィールドコードはpostal\_codeとpostal\_code1のように

最後に1をつけてください

```
(function() {

"use strict";

const url = 'https://api.zipaddress.net'
const fetchAddress = function (postalCode) {
return fetch(url+'?zipcode='+encodeURIComponent(postalCode)).then(function (res) {
return res.json()
})
}

const transform = function (addressComponents) {
const prefecture = addressComponents.pref
const city = addressComponents.city
const area = addressComponents.town
const address = addressComponents.fullAddress
return {
address,
prefecture,
city,
area
}
}

const store = function (record, address) {
Object.keys(record).forEach(function (key) {
if (['address', 'full_address'].indexOf(key) !== -1) {
record[key].value = address.address
} else if (['prefecture', 'city', 'area'].indexOf(key) !== -1) {
record[key].value=address[key]
} else {
var arr = []
key.split('_and_').forEach(function (str) {
if (['prefecture', 'city', 'area'].indexOf(str) !==-1) {
arr.push(address[str])
}
})
if (arr.length>0) {
record[key].value = arr.join('')
}
}
})
}

const store1=function (record, address) {
Object.keys(record).forEach(function (key) {
if (['address1', 'full_address1'].indexOf(key) !== -1) {
record[key].value = address.address
} else if (['prefecture1', 'city1', 'area1'].indexOf(key) !== -1) {
record[key].value = address[key]
} else {
var arr = []
key.split('_and_').forEach(function (str) {
if (['prefecture1', 'city1', 'area1'].indexOf(str) !== -1) {
arr.push(address[str])
}
})
if (arr.length > 0) {
record[key].value = arr.join('')
}
}
})
}

if (fb.events.fields.hasOwnProperty('postal_code')) {
fb.events.fields.postal_code.changed.push(function (state) {
const postalCode = state.record.postal_code.value
if (/^[0-9]{3}(-?)[0-9]{4}/.test(postalCode)) {
fetchAddress(postalCode).then(function (res) {
if (res.code === 200 && res.hasOwnProperty('data')) {
store(state.record, transform(res.data))
}
})
}
})
}

if (fb.events.fields.hasOwnProperty('postal_code1')) {
fb.events.fields.postal_code1.changed.push(function (state) {
const postalCode = state.record.postal_code1.value
if (/^[0-9]{3}(-?)[0-9]{4}/.test(postalCode)) {
fetchAddress(postalCode).then(function (res) {
if (res.code === 200 && res.hasOwnProperty('data')) {
store1(state.record, transform(res.data))
}
})
}
})
}
})();

```

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1031](https://avatars.discourse-cdn.com/v4/letter/l/eb8c5e/32.png) [@Legacy\_Account1031](https://community.cybozu.dev/u/Legacy_Account1031)\
**Post date:** [2019 年 6 月 12 日午後 11:38 UTC](https://community.cybozu.dev/t/topic/4081/5 "2019-06-12T23:38:41Z")

</div>

cstap 友利様

いつもお世話になっております。

毎回、ありがとうございます。

試してみましたが、1つ目の住所はうまくいきますが、2つ目がやはり反応しないみたいです。

ちょっとシンプルな形にしてまた試してみます。

よろしくお願いいたします。

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1031](https://avatars.discourse-cdn.com/v4/letter/l/eb8c5e/32.png) [@Legacy\_Account1031](https://community.cybozu.dev/u/Legacy_Account1031)\
**Post date:** [2019 年 6 月 14 日午前 2:01 UTC](https://community.cybozu.dev/t/topic/4081/6 "2019-06-14T02:01:19Z")

</div>

[https://form.kintoneapp.com/public/form/show/b2ce5eebc2face540bdbae8695358b9a522aafbd726185e7e9c08681105800dc#/](https://form.kintoneapp.com/public/form/show/b2ce5eebc2face540bdbae8695358b9a522aafbd726185e7e9c08681105800dc#/)

テスト的に作ってみましたが、やはり1つ目はうまくいきますが、2つ目が反応しないです。

何か間違っていますでしょうか。

---

<div class="post-metadata">

**Author:** ![Legacy\_Account600](https://avatars.discourse-cdn.com/v4/letter/l/bcef8e/32.png) [@Legacy\_Account600](https://community.cybozu.dev/u/Legacy_Account600)\
**Post date:** [2019 年 7 月 8 日午前 10:01 UTC](https://community.cybozu.dev/t/topic/4081/7 "2019-07-08T10:01:38Z")

</div>

cstap 友利様

突然失礼いたします。

&nbsp;

こちらのcstapの友利様のコードをフォームに試しに入れてみたのですが、

林田様と同様に都道府県、市区町村、番地は自動入力されませんでした。

しかし、住所2と設けてみたところそちらには自動入力されていました。

&nbsp;

prefecture1,city1,area1に対する記述が足りないのかなと思うのですが、

何を追加すればよいのでしょうか？

ご教示のほどよろしくお願いいたします。

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1147](https://avatars.discourse-cdn.com/v4/letter/l/b77776/32.png) [@Legacy\_Account1147](https://community.cybozu.dev/u/Legacy_Account1147)\
**Post date:** [2019 年 8 月 8 日午前 5:00 UTC](https://community.cybozu.dev/t/topic/4081/8 "2019-08-08T05:00:02Z")

</div>

お世話になります。

２か所目が検索されないのはIE上ではないでしょうか？

Edge、Chrome、Safariなどではつつがなく動作しておりますので、IEでのJavaScript問題と思われます。

---

<div class="post-metadata">

**Author:** ![Legacy\_Account600](https://avatars.discourse-cdn.com/v4/letter/l/bcef8e/32.png) [@Legacy\_Account600](https://community.cybozu.dev/u/Legacy_Account600)\
**Post date:** [2019 年 8 月 8 日午前 6:08 UTC](https://community.cybozu.dev/t/topic/4081/9 "2019-08-08T06:08:45Z")

</div>

ysuzuki様

&nbsp;

お世話になっております。

私も林田様と同様に友利様のコードをそのまま使い、

IEではなくChromeで開いてますが、２か所目が検索されませんでした。

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1031](https://avatars.discourse-cdn.com/v4/letter/l/eb8c5e/32.png) [@Legacy\_Account1031](https://community.cybozu.dev/u/Legacy_Account1031)\
**Post date:** [2019 年 8 月 20 日午前 1:41 UTC](https://community.cybozu.dev/t/topic/4081/10 "2019-08-20T01:41:14Z")

</div>

お世話になっております。

上のコードをあきらめて、下記のサイトを参考に以下の通りに実施してみましたところ、一応うまくいきました。

たぶん、下記だとfull\_addressのコードがないように見えるので完ぺきではないと思いますが、とりあえずこれでしのげます。

お騒がせしました。

[https://developer.cybozu.io/hc/ja/community/posts/360000698123–%E9%83%B5%E4%BE%BF%E7%95%AA%E5%8F%B7-%E4%BD%8F%E6%89%80-%E3%83%95%E3%82%A9%E3%83%BC%E3%83%A0%E3%83%96%E3%83%AA%E3%83%83%E3%82%B8%E3%81%A7%E3%81%AE%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6](https://developer.cybozu.io/hc/ja/community/posts/360000698123--%E9%83%B5%E4%BE%BF%E7%95%AA%E5%8F%B7-%E4%BD%8F%E6%89%80-%E3%83%95%E3%82%A9%E3%83%BC%E3%83%A0%E3%83%96%E3%83%AA%E3%83%83%E3%82%B8%E3%81%A7%E3%81%AE%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6)&nbsp;

①下記のURLをカスタマイズで読み込む

[https://code.jquery.com/jquery-2.1.0.min.js](https://code.jquery.com/jquery-2.1.0.min.js)

②下記のコードを読み込む

//============================================  
// 郵便番号から住所を入力  
//============================================  
(function() {  
“use strict”;

//=====================================  
//郵便番号の値を変更した際のイベント①  
//=====================================  
fb.events.fields.postal\_code.changed = [function (state) {

//郵便番号Aの値を取得  
var zip = state.record.postal\_code.value;

//URL設定([http://zipaddress.net/のAPIを使用](http://zipaddress.net/%E3%81%AEAPI%E3%82%92%E4%BD%BF%E7%94%A8))  
var url = ‘[https://api.zipaddress.net/?zipcode=](https://api.zipaddress.net/?zipcode=)’ + zip;

$.ajax({  
url: url,  
type: ‘GET’,  
dataType: ‘json’  
})  
.done((data) =\> {  
//住所フィールドに値を入力  
//====================================================  
//pref: 都道府県の文字列  
//city: 市区町村の文字列  
//town: 町域名の文字列  
//address: 市区町村の文字列（cityとtownを結合したもの）  
//fullAddress: 都道府県+市区町村+町域名の結合文字列  
//====================================================  
state.record.prefecture.value = data.data.pref;  
state.record.city.value = data.data.city;  
state.record.area.value = data.data.town;  
})  
.fail((data) =\> {  
// console.log(data);  
})  
.always((data) =\> {  
});

return state;

}];

//=====================================  
//郵便番号の値を変更した際のイベント②  
//=====================================  
fb.events.fields.postal\_code1.changed = [function (state) {

//郵便番号Bの値を取得  
var zip = state.record.postal\_code1.value;

//URL設定([http://zipaddress.net/のAPIを使用](http://zipaddress.net/%E3%81%AEAPI%E3%82%92%E4%BD%BF%E7%94%A8))  
var url = ‘[https://api.zipaddress.net/?zipcode=](https://api.zipaddress.net/?zipcode=)’ + zip;

$.ajax({  
url: url,  
type: ‘GET’,  
dataType: ‘json’  
})  
.done((data) =\> {  
//住所フィールドに値を入力  
//====================================================  
//pref: 都道府県の文字列  
//city: 市区町村の文字列  
//town: 町域名の文字列  
//address: 市区町村の文字列（cityとtownを結合したもの）  
//fullAddress: 都道府県+市区町村+町域名の結合文字列  
//====================================================  
state.record.prefecture1.value = data.data.pref;  
state.record.city1.value = data.data.city;  
state.record.area1.value = data.data.town;  
})  
.fail((data) =\> {  
// console.log(data);  
})  
.always((data) =\> {  
});

return state;

}];

})();

&nbsp;

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex015/uploads/cybozu/original/1X/d5c841c3c5a6cb66eed514001c1b45147c9e1f4f.png) [@system](https://community.cybozu.dev/u/system)\
**Post date:** [2024 年 9 月 25 日午前 5:38 UTC](https://community.cybozu.dev/t/topic/4081/11 "2024-09-25T05:38:41Z")

</div>

クローズされました: 2024 年 9 月 25 日午前 5:38 UTC

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。