Suyeon Jung

Update index view

...@@ -8,11 +8,12 @@ require('dotenv').config(); ...@@ -8,11 +8,12 @@ require('dotenv').config();
8 // 사용자가 index 페이지에서 주소를 입력하고 넘어오면 8 // 사용자가 index 페이지에서 주소를 입력하고 넘어오면
9 router.post('/', function(req, res) { 9 router.post('/', function(req, res) {
10 console.log(req.body); 10 console.log(req.body);
11 - let userSi = req.body.si 11 + let userLocation = req.body.userLocation;
12 - let userDong = req.body.dong; 12 + // let userSi = req.body.si
13 - let userLocation = `${userSi} ${userDong}`; 13 + // let userDong = req.body.dong;
14 let xyList = []; 14 let xyList = [];
15 console.log(userLocation); 15 console.log(userLocation);
16 + // console.log(req);
16 let YOUR_API_KEY = process.env.KAKAO_APIKEY; 17 let YOUR_API_KEY = process.env.KAKAO_APIKEY;
17 let kakaoOptions = { 18 let kakaoOptions = {
18 url: 'https://dapi.kakao.com/v2/local/search/address.json', 19 url: 'https://dapi.kakao.com/v2/local/search/address.json',
...@@ -34,7 +35,7 @@ router.post('/', function(req, res) { ...@@ -34,7 +35,7 @@ router.post('/', function(req, res) {
34 console.log(xyList); 35 console.log(xyList);
35 } 36 }
36 }) 37 })
37 - res.render('select', { 'si': req.body.si, 'dong': req.body.dong }); 38 + res.render('select', { 'userLocation': req.body.userLocation });
38 }); 39 });
39 40
40 module.exports = router; 41 module.exports = router;
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -3,108 +3,9 @@ html ...@@ -3,108 +3,9 @@ html
3 head 3 head
4 title= title 4 title= title
5 link(rel='stylesheet', href='stylesheets/style.css') 5 link(rel='stylesheet', href='stylesheets/style.css')
6 - script(type='text/javascript').
7 - function addressKindChange(e) {
8 -
9 - var xhr = new XMLHttpRequest();
10 - var HttpUrl = "http://openapi.nsdi.go.kr/nsdi/eios/service/rest/AdmService/admDongList.json"; /*URL*/
11 - var parameter = '?' + encodeURIComponent("authkey") +"="+encodeURIComponent("7ded580bb63772d9041202"); /*authkey Key*/
12 - parameter += "&" + encodeURIComponent("admCode") + "=" + encodeURIComponent(`${e.value}`); /* 시도/시군구 코드(5자리) */
13 -
14 - xhr.open('GET', HttpUrl + parameter);
15 - console.log(xhr);
16 - xhr.onreadystatechange = function () {
17 - if (this.readyState == 4) {
18 -
19 - var result = JSON.parse(this.responseText);
20 - var dong_name = [];
21 - var dong_code = [];
22 - for(var i=0; i<result["admVOList"]["admVOList"].length; i++){
23 - dong_name.push(result["admVOList"]["admVOList"][i].lowestAdmCodeNm);
24 - dong_code.push(result["admVOList"]["admVOList"][i].admCode);
25 - }
26 - console.log(dong_code);
27 - var target = document.getElementById("dong");
28 - target.options.length = 0;
29 -
30 - for (x in dong_name) {
31 - var opt = document.createElement("option");
32 - opt.value = dong_code[x];
33 - opt.innerHTML = dong_name[x];
34 - target.appendChild(opt);
35 - }
36 -
37 - }
38 - };
39 - xhr.send();
40 - }
41 body 6 body
42 - block content 7 + img.image(src='/logo.png')
43 - img.image(src='/logo.png') 8 + form(action='/select' method='post' name='location')
44 - 9 + input(type="text" id='userLocation' name='userLocation' placeholder="당신의 동네 주소를 입력해주세요(시/구/동)" style="width: 300px; height: 30px;")
45 - 10 + input(type="submit" value="검색")
46 - form(action='/select' method='post' id='location')
47 - <div class="form-group col-sm-5">
48 - <label for="si">시</label>
49 - <select class="form-control" id="si" name="si" onchange="addressKindChange(this)">
50 - <option>시</option>
51 - <option value="41820">가평군</option>
52 - <option value="41280">고양시</option>
53 - <option value="41281">고양시 덕양구</option>
54 - <option value="41285">고양시 일산동구</option>
55 - <option value="41287">고양시 일산서구</option>
56 - <option value="41290">과천시</option>
57 - <option value="41210">광명시</option>
58 - <option value="41610">광주시</option>
59 - <option value="41310">구리시</option>
60 - <option value="41410">군포시</option>
61 - <option value="41570">김포시</option>
62 - <option value="41360">남양주시</option>
63 - <option value="41250">동두천시</option>
64 - <option value="41190">부천시</option>
65 - <option value="41130">성남시</option>
66 - <option value="41135">성남시 분당구</option>
67 - <option value="41131">성남시 수정구</option>
68 - <option value="41133">성남시 중원구</option>
69 - <option value="41110">수원시</option>
70 - <option value="41113">수원시 권선구</option>
71 - <option value="41117">수원시 영통구</option>
72 - <option value="41111">수원시 장안구</option>
73 - <option value="41115">수원시 팔달구</option>
74 - <option value="41390">시흥시</option>
75 - <option value="41270">안산시</option>
76 - <option value="41273">안산시 단원구</option>
77 - <option value="41271">안산시 상록구</option>
78 - <option value="41550">안성시</option>
79 - <option value="41170">안양시</option>
80 - <option value="41173">안양시 동안구</option>
81 - <option value="41171">안양시 만안구</option>
82 - <option value="41630">양주시</option>
83 - <option value="41830">양평군</option>
84 - <option value="41670">여주시</option>
85 - <option value="41800">연천군</option>
86 - <option value="41370">오산시</option>
87 - <option value="41460">용인시</option>
88 - <option value="41463">용인시 기흥구</option>
89 - <option value="41465">용인시 수지구</option>
90 - <option value="41461">용인시 처인구</option>
91 - <option value="41430">의왕시</option>
92 - <option value="41150">의정부시</option>
93 - <option value="41500">이천시</option>
94 - <option value="41480">파주시</option>
95 - <option value="41220">평택시</option>
96 - <option value="41650">포천시</option>
97 - <option value="41450">하남시</option>
98 - <option value="41590">화성시</option>
99 - </select>
100 - </div>
101 - <div class="form-group col-sm-4">
102 - <label for="dong">동</label>
103 - <select class="form-control" id="dong" name="dong">
104 - <option>선택해주세요.</option>
105 - </select>
106 - </div>
107 -
108 - input(type ='submit')
109 -
110 11
......
1 doctype html 1 doctype html
2 html 2 html
3 head 3 head
4 - if location =="n" 4 + title= title
5 - button k 5 + link(rel='stylesheet', href='stylesheets/style.css')
6 body 6 body
7 block content 7 block content
8 - h1 당신의 동네 : #{si} #{dong} 8 + h1 당신의 동네 : #{userLocation}
9 .row 9 .row
10 .col.s12.m7 10 .col.s12.m7
11 .card(style='background-color: skyblue; display: inline-block;') 11 .card(style='background-color: skyblue; display: inline-block;')
......