주소 검색 팝업 javascript + asp

주소를 검색하는 팝업을 구현.

소스코드 등록하는 거 사용하면 깔끔한데 그것도 허허 은근 귀찮아서 이러는데... 허헝

<input type="text" name="zipno_1" id="zipno_1" size="10" class="txtbox_1" readonly="" onclick="oPopup('recruit_zipcode.html', '470', '370')" style="cursor:pointer;">                                                 -  <input type="text" name="zipno_2" id="zipno_2" size="10" class="txtbox_1" readonly="" onclick="oPopup('recruit_zipcode.html', '470', '370')" style="cursor:pointer;">                                                 &nbsp;&nbsp; <a href="#"> <img src="../images/membership/recruit_btn_postnum.gif" width="80" height="20" border="0" align="absbottom" onclick="oPopup('recruit_zipcode.html', '470', '370')" style="cursor:pointer;">                                                 </a>

먼저 요런 식으로 우편 번호 두 곳이랑 우편주소 찾기 버튼을 만들었다.

여기서 oPopup은 별건 아니고, 

function oPopup(src, w, h)

{

window.open(src, "win", "toolbar=0 ,location=0,directories=0,status=0,menubar=0,scrollbars=no,resizable=1,width="+w+",height="+h+",top=0,left=0");

}

그냥 이렇게 생긴 간단한 함수.

하여튼 이제 recruit_zipcode.html로 넘어가 보면 주소 검색 텍스트 영역이랑 버튼을 요렇게 구성함. onkeydown은 엔터 쳤을 경우에도 먹히도록 넣은 거고, 검색 버튼을 누르면 Search_addr() 함수로 고고.

<input type="text" name="dong_name" size="30" class="txtbox_1" onkeydown="if(event.keyCode==13){Search_Addr();return false;}">&nbsp;

<img src="../images/membership/recruit_lay_btn01.gif" width="48" height="23" align="absmiddle" border="0" onclick="Search_Addr();" style="cursor:pointer">

search_addr 함수는 요렇게 생겼다

function Search_Addr() { if (document.zipcode_Form.dong_name.value == "") { alert("읍,면,동이름이 비어있습니다"); document.zipcode_Form.dong_name.focus(); return; } document.zipcode_Form.submit(); }

그러면 이젠 zipcode_form을 서브밋 시키면 해당 페이지로 가는데 여기는 asp로 코딩 부분이 들어가 있다.

음 이 부분은 여기에 안 쓰는게 나을 것 같다. ㅋㅋ

그냥 말로 설명하면

DB 연결하고 앞에서 넘겨받은 이름을 토대로 select 해서 결과를 끝까지 movenext 해가면서 나 같은 경우는 select의 option에 넣었다. 그리고 select 해서 고르게 되면 onchange에 addrSelect()를 넣어서

요렇게 아래 두 hidden에 넣어주었다. 위에껀 우편번호 아래껀 주소.

function addrSelect()     {         var oAddr = document.getElementById("addr_select");         var szAddrValue = oAddr.options[oAddr.selectedIndex].value;         var szAddrText = oAddr.options[oAddr.selectedIndex].text;         document.getElementById("nZipcode").value = szAddrValue;         document.getElementById("szSelectAddr").value = szAddrText;     } }

이러고 나서 나중에 등록 버튼 눌러서 submit 할 때는 다 입력되었는지 확인하고 난 뒤 우편번호는 두개로 쪼개고 주소는 기본 검색 주소랑 상세 주소를 합쳐서 전송했다. 

else

{

var nZipNo = oForm.nZipcode.value.split("-");

opener.document.getElementById("zipno_1").value = nZipNo[0];

opener.document.getElementById("zipno_2").value = nZipNo[1];

opener.document.getElementById("detail_addr").value = oForm.szSelectAddr.value + " " + oForm.detail_addr.value; 

self.close();

        document.addrform.submit();

}

1. 

2. 

3. 

4. 

5. 

6.