- key 발급 필요없으며
- 기업, 상업용이든 무조건 무료로 사용 가능
- 행정안전부에서 제공하는 주소 DB를 직접 업데이트
API를 받을 수 있는 해당 링크에도 잘 설명이 되어있다
사용 방법
html이나 jsp파일의 <head>나 <body> 윗부분에 작성한다
<script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
기본 틀을 작성한 후에
우편번호 검색을 호출하는 함수를 작성한다
function openHomeSearch(){
new daum.Postcode({
oncomplete: function(data) {
// json 형태로 데이터가 전달
console.log(data);
}
}).open();
}
사용 예시
<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<script type="text/javascript" src="/resources/js/jquery.min.js"></script>
<script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
<div class="row">
<div class="col-md-12 card">
<div class="card-header">
<h3>유저 카드 등록</h3>
</div>
<div class="card-body row" style="justify-content: space-between;">
<div class="card-body p-0">
<form method="post" action="/prod/cardFormPost">
<p><input value="a001" placeholder="아이디" type="text" name="userId" id="userId"></p>
<p><input value="java" placeholder="비밀번호" type="password" name="password" id="password"></p>
<p><input value="오리" placeholder="이름" type="text" name="name" id="name"></p>
<p><input value="duckduck@duck.com" placeholder="이메일" type="text" name="email" id="email"></p>
<p><input value="2020-06-30" placeholder="생년월일" type="date" name="bir" id="bir "></p>
<p><input value="12345" placeholder="우편번호" type="text" name="zipcode" id="zipcode">
<input type="button" value="우편번호 검색" onclick="openHomeSearch()">
</p>
<p><input value="대전" placeholder="주소" type="text" name="addr" id="addr"></p>
<p><input value="건물" placeholder="상세주소" type="text" name="addrdet" id="addrdet"></p>
</form>
</div>
<!-- /.card-body -->
</div>
</div>
</div>
<script>
function openHomeSearch(){
new daum.Postcode({
oncomplete: function(data) {
// json 형태로 데이터가 전달
console.log(data);
$('#zipcode').val(data.zonecode);
$('#addr').val(data.address);
$('#addrdet').val(data.buildingName);
$('#addrdet').focus();
}
}).open();
}
</script>
'Spring' 카테고리의 다른 글
[Spring] 파일 업로드 구현 (0) | 2024.08.05 |
---|---|
[Spring] 다중 삽입하기 - 객체 (+ checkbox, select) (0) | 2024.08.02 |
[Spring] 상품별 장바구니 목록 prod-cart-member (0) | 2024.07.31 |
[Spring] lprod 분류별 상품 보기 - resultMap (0) | 2024.07.31 |
[Spring] buyprod 상세보기 (0) | 2024.07.31 |