CodeIgniter 우편번호 찾기
새 도로명 주소 등을 또 적용해야 하는 문제가 있는데, 아래 코드는 기존 읍면동을 검색하는 코드입니다.
아래 사이트에서 jQuery를 이용하여 간단히 우편번호 검색 API를 제공을 해 줍니다.
여기를 이용해 보시길 권장 합니다.
http://www.newroad.co.kr
우편번호 데이터는 http://www.epost.go.kr/search/zipcode/jibunAddressDown.jsp 를 참고함
http://naradesign.net/ouif/uio/table/multipleHeader/html.html
http://naradesign.net/ouif/uio/button/package/html.html
* SQL 파일 (table 명 zipcode)
zipcode.zip
* Form 에서 우편번호 코드
$("#open_zip_search").click(function(e){window.open("/zipcode/search", "zipcode_window", "width=500,height=400,resizable=no,scrollbars=yes,status=no");e.preventDefault();return false;});
* controller/zipcode.php
input->post('dong'); $search_result = $this->db->where("dong like '%".$dong."%'")->get('zipcode')->result_array(); $this->output->set_content_type('application/json') ->set_output(json_encode($search_result)); } public function search() { $this->load->view('zipcode_find_window'); } }
* view/zipcode_find_window.php
우편번호 찾기 body{margin:0;padding:10px 20px;} .button, .button *{ position:relative; margin:0; padding:0; display:inline-block; text-decoration:none !important; border:0; font-size:12px; font-family:dotum, Sans-serif; white-space:nowrap; background:url(https://t1.daumcdn.net/cfile/tistory/222FD04D5295F96037) no-repeat; vertical-align:top; overflow:visible; color:#333;} .button { margin-right:4px;} .button *{ left:4px; cursor:pointer; _cursor:hand;} .button.medium, .button.medium *{ height:24px; line-height:24px;} .button.large, .button.large *{ height:30px; line-height:30px;} .button.xLarge, .button.xLarge *{ height:36px; line-height:36px;} .button.small, .button.small *{ height:19px; line-height:19px;} .button.medium { background-position:left 0;} .button.large { background-position:left -30px;} .button.xLarge { background-position:left -65px;} .button.small { background-position:left -106px;} .button.medium *{ padding:0 10px 0 6px; font-size:12px; background-position:right top;} .button.large *{ padding:0 10px 0 6px; font-size:16px; background-position:right -30px;} .button.xLarge *{ padding:0 10px 0 6px; font-size:20px; background-position:right -65px;} .button.small *{ padding:0 6px 0 2px; font-size:11px; background-position:right -106px;} .button *:hover, .button *:active, .button *:focus{ color:#690;} .button.strong *{ font-weight:bold !important;} .table{border:0;border-collapse:collapse;margin:1em 0;font-size:12px;font-family:dotum;} .table table{width:100%;border:0;border-top:2px solid #666} .table caption{padding:8px 0;font-weight:bold;text-align:left} .table caption em{float:right;font-style:normal;font-weight:normal;color:#f60} .table th,.table td{border:0;padding:8px;vertical-align:top;text-align:left;border-bottom:1px solid #ddd} .table th{background:#f8f8f8} .table thead th{border-bottom:1px solid #999} .table tfoot td{font-weight:bold;background:#f8f8f8} #top { margin:0;padding:0;font-size: 14px; font-family: dotum; } input[name=dong] { font-size: 14px; font-family: dotum; padding: 2px 4px; border: 1px solid #ccc; } a.input { text-decoration: none; color: #000; display: block; } 읍면동 이름 : 우편번호 찾기 우편번호 주소 $("#find_zipcode").click(function(e){ var dong = $("input[name=dong]"); if (dong.val() == "") { alert('검색어를 입력해 주세요.'); dong.focus(); } else { $.post("/zipcode/find_by_dong", {dong: dong.val()}, function(r) { $("#zipcode_table tbody").html(''); for (var i=0; i' + r[i].zip_no.substring(0,3) + '-' + r[i].zip_no.substring(3,6) + ' ' + r[i].address + ' '); } }, "json"); } e.preventDefault(); return false; }); $("input[name=dong]").focus().keydown(function(e){ if (e.keyCode == 13) { $("#find_zipcode").click(); e.preventDefault(); return false; } }); $(document).on('click', 'a.input', function(e) { var that = $(this); var parent = that.closest('tr'); var text = $('td.zip_no', parent).text() + ' ' + $('td.address', parent).text() + ' '; var input = opener.document.getElementById('address_input'); input.value = text; input.focus(); opener = ''; window.close(); e.preventDefault(); return false; });
Form 에서 ID address_input 를 고치면 검색 뷰에서도 고쳐야 합니다. 참고로만 사용해 주세요.
IE 8+, Chrome 에서 정상 작동을 확인했습니다.
from http://ejnahc.tistory.com/462 by ccl(A) rewrite - 2020-03-06 08:20:42
댓글
댓글 쓰기