Showing
5 changed files
with
65 additions
and
500 deletions
| ... | @@ -14,7 +14,6 @@ var router = express.Router(); | ... | @@ -14,7 +14,6 @@ var router = express.Router(); |
| 14 | router.get('/jj',function(req,res){ | 14 | router.get('/jj',function(req,res){ |
| 15 | res.render('jj',{title : "첫번째 화면~"}); | 15 | res.render('jj',{title : "첫번째 화면~"}); |
| 16 | }) | 16 | }) |
| 17 | - | ||
| 18 | router.get('/first',function(req,res){ | 17 | router.get('/first',function(req,res){ |
| 19 | res.render('first',{title : "첫번째 화면~"}); | 18 | res.render('first',{title : "첫번째 화면~"}); |
| 20 | }) | 19 | }) |
| ... | @@ -27,22 +26,20 @@ router.get('/list', function(req, res){ | ... | @@ -27,22 +26,20 @@ router.get('/list', function(req, res){ |
| 27 | res.render('list',{title :"게시판"}); | 26 | res.render('list',{title :"게시판"}); |
| 28 | }); | 27 | }); |
| 29 | 28 | ||
| 30 | -router.get('/res', function(req, res){ | ||
| 31 | - res.render('reservation',{title :"예약"}); | ||
| 32 | -}); | ||
| 33 | 29 | ||
| 34 | -router.post('/res',function(req, res){ | 30 | +router.post('/jj',function(req, res){ |
| 35 | var creater_id = req.body.creater_id; | 31 | var creater_id = req.body.creater_id; |
| 36 | var phone = req.body.phone; | 32 | var phone = req.body.phone; |
| 37 | var email = req.body.email; | 33 | var email = req.body.email; |
| 38 | var num = req.body.num; | 34 | var num = req.body.num; |
| 39 | var restime = req.body.restime; | 35 | var restime = req.body.restime; |
| 40 | var resmin = req.body.resmin; | 36 | var resmin = req.body.resmin; |
| 37 | + var date = req.body.date; | ||
| 41 | var content = req.body.content; | 38 | var content = req.body.content; |
| 42 | pool.getConnection(function (err, connection) | 39 | pool.getConnection(function (err, connection) |
| 43 | { | 40 | { |
| 44 | // Use the connection | 41 | // Use the connection |
| 45 | - var sqlForInsertBoard = "insert into menu(creater_id, phone, email, num, restime, resmin, content) values('"+creater_id+"', '"+phone+"', '"+email+"','"+num+"','"+restime+"','"+resmin+"', '"+content+"')"; | 42 | + var sqlForInsertBoard = "insert into menu(creater_id, phone, email, num, restime, resmin,date, content) values('"+creater_id+"', '"+phone+"', '"+email+"','"+num+"','"+restime+"','"+resmin+"','"+date+"', '"+content+"')"; |
| 46 | connection.query(sqlForInsertBoard, function (err, rows) { | 43 | connection.query(sqlForInsertBoard, function (err, rows) { |
| 47 | if (err) console.error("err : " + err); | 44 | if (err) console.error("err : " + err); |
| 48 | console.log("rows : " + JSON.stringify(rows)); | 45 | console.log("rows : " + JSON.stringify(rows)); | ... | ... |
| ... | @@ -87,246 +87,6 @@ | ... | @@ -87,246 +87,6 @@ |
| 87 | </div> | 87 | </div> |
| 88 | </section> | 88 | </section> |
| 89 | 89 | ||
| 90 | -<style type="text/css"> | ||
| 91 | -.reservationTheme{ | ||
| 92 | - background:url('/img/a-bg.jpg') no-repeat; | ||
| 93 | -} | ||
| 94 | -</style> | ||
| 95 | - | ||
| 96 | - | ||
| 97 | - <section id="about" class="reservationTheme content-section text-center"> | ||
| 98 | - <div class="container"> | ||
| 99 | - <br><br> | ||
| 100 | - <h2>Reservation</h2> | ||
| 101 | - <br><br> | ||
| 102 | - <form class="well form-horizontal" action=" " method="post" id="contact_form"> | ||
| 103 | - <fieldset> | ||
| 104 | - | ||
| 105 | - <form method="POST" action="/res"> | ||
| 106 | - <!-- Form Name --> | ||
| 107 | - | ||
| 108 | - <!-- Text input--> | ||
| 109 | - <div class="form-group"> | ||
| 110 | - <div class="col-md-4 inputGroupContainer"> | ||
| 111 | - <div class="input-group"> | ||
| 112 | - <label class="col-md-4 control-label">이름</label> | ||
| 113 | - <i class="glyphicon glyphicon-envelope"></i> | ||
| 114 | - <input name="creater_id" placeholder="홍길동" class="form-control" type="text"> | ||
| 115 | - </div> | ||
| 116 | - </div> | ||
| 117 | - </div> | ||
| 118 | - | ||
| 119 | - | ||
| 120 | - <!-- 휴대전화--> | ||
| 121 | - <div class="form-group"> | ||
| 122 | - <div class="col-md-4 inputGroupContainer"> | ||
| 123 | - <div class="input-group"> | ||
| 124 | - <label class="col-md-4 control-label">휴대전화</label> | ||
| 125 | - | ||
| 126 | - <i class="glyphicon glyphicon-earphone"></i> | ||
| 127 | - <input name="phone" placeholder="010-123-4567" class="form-control" type="text"> | ||
| 128 | - </div> | ||
| 129 | - </div> | ||
| 130 | - </div> | ||
| 131 | - | ||
| 132 | - | ||
| 133 | - | ||
| 134 | - <!-- Text input--> | ||
| 135 | - <div class="form-group"> | ||
| 136 | - <div class="col-md-4 inputGroupContainer"> | ||
| 137 | - <div class="input-group"> | ||
| 138 | - <label class="col-md-4 control-label">이메일주소</label> | ||
| 139 | - | ||
| 140 | - <i class="glyphicon glyphicon-envelope"></i> | ||
| 141 | - <input name="email" placeholder="E-Mail Address" class="form-control" type="text"> | ||
| 142 | - </div> | ||
| 143 | - </div> | ||
| 144 | - </div> | ||
| 145 | - | ||
| 146 | - <!--인원수--> | ||
| 147 | - <div class="form-group"> | ||
| 148 | - <div class="col-md-4 selectContainer"> | ||
| 149 | - <div class="input-group"> | ||
| 150 | - <label class="col-md-4 control-label">인원 수</label> | ||
| 151 | - | ||
| 152 | - <i class="glyphicon glyphicon-list"></i> | ||
| 153 | - <select name="num" class="form-control selectpicker" > | ||
| 154 | - <option value=" " >인원 수를 선택하세요.</option> | ||
| 155 | - <option>1~4명</option> | ||
| 156 | - <option>5~10명</option> | ||
| 157 | - <option >10명~15명</option> | ||
| 158 | - <option >15명~20명</option> | ||
| 159 | - <option >20명 이상</option> | ||
| 160 | - </select> | ||
| 161 | - </div> | ||
| 162 | - </div> | ||
| 163 | - </div> | ||
| 164 | - | ||
| 165 | - <!--예약시간--> | ||
| 166 | - <div class="form-group"> | ||
| 167 | - <div class="col-md-4 selectContainer"> | ||
| 168 | - <div class="input-group"> | ||
| 169 | - <label class="col-md-4 control-label">예약 시간</label> | ||
| 170 | - | ||
| 171 | - <i class="glyphicon glyphicon-list"></i> | ||
| 172 | - <select name="restime" class="form-control selectpicker" > | ||
| 173 | - <option value=" " >시간</option> | ||
| 174 | - <option>10시</option> | ||
| 175 | - <option>11시</option> | ||
| 176 | - <option>12시</option> | ||
| 177 | - <option>13시</option> | ||
| 178 | - <option>14시</option> | ||
| 179 | - <option>15시</option> | ||
| 180 | - <option>16시</option> | ||
| 181 | - <option>17시</option> | ||
| 182 | - <option>18시</option> | ||
| 183 | - <option>19시</option> | ||
| 184 | - <option>20시</option> | ||
| 185 | - </select> | ||
| 186 | - | ||
| 187 | - <select name="resmin" class="form-control selectpicker" > | ||
| 188 | - <option value=" " >분</option> | ||
| 189 | - <option>00분</option> | ||
| 190 | - <option>15분</option> | ||
| 191 | - <option>30분</option> | ||
| 192 | - <option>45분</option> | ||
| 193 | - </select> | ||
| 194 | - </div> | ||
| 195 | - </div> | ||
| 196 | - </div> | ||
| 197 | - | ||
| 198 | - <!--예약날짜--> | ||
| 199 | - <div class="form-group"> | ||
| 200 | - <div class="col-md-4 selectContainer"> | ||
| 201 | - <div class="input-group"> | ||
| 202 | - <label class="col-md-4 control-label">예약 날짜</label> | ||
| 203 | - <input type="text" placeholder = "클릭하여 달력 보기" id="datepicker"></p></p> | ||
| 204 | - <script> | ||
| 205 | - $( function() { | ||
| 206 | - $( "#datepicker" ).datepicker(); | ||
| 207 | - } ); | ||
| 208 | - </script> | ||
| 209 | - </label> | ||
| 210 | - </div> | ||
| 211 | - <!-- radio checks | ||
| 212 | - <div class="form-group"> | ||
| 213 | - <label class="col-md-4 control-label">Do you have hosting?</label> | ||
| 214 | - <div class="col-md-4"> | ||
| 215 | - <div class="radio"> | ||
| 216 | - <label> | ||
| 217 | - <input type="radio" name="hosting" value="yes" /> Yes | ||
| 218 | - </label> | ||
| 219 | - </div> | ||
| 220 | - <div class="radio"> | ||
| 221 | - <label> | ||
| 222 | - <input type="radio" name="hosting" value="no" /> No | ||
| 223 | - </label> | ||
| 224 | - </div> | ||
| 225 | - </div> | ||
| 226 | - </div> | ||
| 227 | - --> | ||
| 228 | - <!-- Text area --> | ||
| 229 | - | ||
| 230 | - <div class="form-group"> | ||
| 231 | - <div class="col-md-4 selectContainer"> | ||
| 232 | - <div class="input-group"> | ||
| 233 | - <label class="col-md-4 control-label">예약 날짜</label> | ||
| 234 | - <span class="input-group-addon"><i class="glyphicon glyphicon-pencil"></i></span> | ||
| 235 | - <textarea class="form-control" name="content" placeholder="Project Description" style="width:3500px; height:100px;"></textarea> | ||
| 236 | - </div> | ||
| 237 | - </div> | ||
| 238 | - </div> | ||
| 239 | - <br> | ||
| 240 | - <br> | ||
| 241 | - <br> | ||
| 242 | - <!-- Success message --> | ||
| 243 | - <div class="alert alert-success" role="alert" id="success_message"> <i class="glyphicon glyphicon-thumbs-up"></i> 예약해주셔서 감사합니다.</div> | ||
| 244 | - | ||
| 245 | - <!-- Button --> | ||
| 246 | - <div class="form-group"> | ||
| 247 | - <label class="col-md-4 control-label"></label> | ||
| 248 | - <div class="col-md-4"> | ||
| 249 | - <button type="submit" class="btn btn-warning" >예약 <span class="glyphicon glyphicon-send"></span></button> | ||
| 250 | - </div> | ||
| 251 | - | ||
| 252 | - </div> | ||
| 253 | - </form> | ||
| 254 | - </fieldset> | ||
| 255 | - </form> | ||
| 256 | - </div> | ||
| 257 | - </div> | ||
| 258 | - | ||
| 259 | - | ||
| 260 | - <script> | ||
| 261 | - function onWriteSubmit() | ||
| 262 | - { | ||
| 263 | - if ( $("#creater_id").val().trim() == "" ) | ||
| 264 | - { | ||
| 265 | - var message = "아이디를 입력해 주세요"; | ||
| 266 | - $("#creater_id").val(""); | ||
| 267 | - $("#creater_id").focus(); | ||
| 268 | - alert(message); | ||
| 269 | - return false; | ||
| 270 | - } | ||
| 271 | - | ||
| 272 | - if ( $("#phone").val().trim() == "" ) | ||
| 273 | - { | ||
| 274 | - var message = "폰번호를 입력해 주세요"; | ||
| 275 | - $("#phone").val(""); | ||
| 276 | - $("#phone").focus(); | ||
| 277 | - alert(message); | ||
| 278 | - return false; | ||
| 279 | - } | ||
| 280 | - if ( $("#email").val().trim() == "" ) | ||
| 281 | - { | ||
| 282 | - var message = "이메일 주소를 입력해 주세요"; | ||
| 283 | - $("#email").val(""); | ||
| 284 | - $("#email").focus(); | ||
| 285 | - alert(message); | ||
| 286 | - return false; | ||
| 287 | - }if ( $("#num").val().trim() == "" ) | ||
| 288 | - { | ||
| 289 | - var message = "인원수를 입력해 주세요"; | ||
| 290 | - $("#num").val(""); | ||
| 291 | - $("#num").focus(); | ||
| 292 | - alert(message); | ||
| 293 | - return false; | ||
| 294 | - }if ( $("#restime").val().trim() == "" ) | ||
| 295 | - { | ||
| 296 | - var message = "예약시간을 입력해 주세요"; | ||
| 297 | - $("#restime").val(""); | ||
| 298 | - $("#restime").focus(); | ||
| 299 | - alert(message); | ||
| 300 | - return false; | ||
| 301 | - } | ||
| 302 | - if ( $("#resmin").val().trim() == "" ) | ||
| 303 | - { | ||
| 304 | - var message = "예약 분을 입력해 주세요"; | ||
| 305 | - $("#resmin").val(""); | ||
| 306 | - $("#resmin").focus(); | ||
| 307 | - alert(message); | ||
| 308 | - return false; | ||
| 309 | - } | ||
| 310 | - if ( $("#content").val().trim() == "" ) | ||
| 311 | - { | ||
| 312 | - var message = "비고사항을 입력해 주세요"; | ||
| 313 | - $("#content").val(""); | ||
| 314 | - $("#content").focus(); | ||
| 315 | - alert(message); | ||
| 316 | - return false; | ||
| 317 | - } | ||
| 318 | - | ||
| 319 | - | ||
| 320 | - } | ||
| 321 | - </script> | ||
| 322 | - | ||
| 323 | - | ||
| 324 | - | ||
| 325 | - | ||
| 326 | - | ||
| 327 | - | ||
| 328 | - | ||
| 329 | - | ||
| 330 | 90 | ||
| 331 | <!-- Download Section --> | 91 | <!-- Download Section --> |
| 332 | <section id="download" class="download-section content-section text-center"> | 92 | <section id="download" class="download-section content-section text-center"> |
| ... | @@ -334,7 +94,7 @@ | ... | @@ -334,7 +94,7 @@ |
| 334 | <div class="col-lg-8 mx-auto"> | 94 | <div class="col-lg-8 mx-auto"> |
| 335 | <h2>Reservation</h2> | 95 | <h2>Reservation</h2> |
| 336 | <p>당일 예약은 전화예약만 가능합니다.</p> | 96 | <p>당일 예약은 전화예약만 가능합니다.</p> |
| 337 | - <a href="http://startbootstrap.com/template-overviews/grayscale/" class="btn btn-default btn-lg">예약하기</a> | 97 | + <a href="/jj" class="btn btn-default btn-lg">예약하기</a> |
| 338 | </div> | 98 | </div> |
| 339 | </div> | 99 | </div> |
| 340 | </section> | 100 | </section> | ... | ... |
| ... | @@ -39,7 +39,7 @@ | ... | @@ -39,7 +39,7 @@ |
| 39 | <form class="well form-horizontal" action=" " method="post" id="contact_form"> | 39 | <form class="well form-horizontal" action=" " method="post" id="contact_form"> |
| 40 | <fieldset> | 40 | <fieldset> |
| 41 | 41 | ||
| 42 | - <form method="POST" action="/res"> | 42 | + <form method="POST" action="/jj"> |
| 43 | <!-- Form Name --> | 43 | <!-- Form Name --> |
| 44 | 44 | ||
| 45 | <!-- Text input--> | 45 | <!-- Text input--> |
| ... | @@ -155,7 +155,7 @@ | ... | @@ -155,7 +155,7 @@ |
| 155 | <label class="col-md-4 control-label"></label> | 155 | <label class="col-md-4 control-label"></label> |
| 156 | 156 | ||
| 157 | <i class="glyphicon glyphicon-list"></i> | 157 | <i class="glyphicon glyphicon-list"></i> |
| 158 | - <select name="num" class="form-control selectpicker" > | 158 | + <select name="date" class="form-control selectpicker" > |
| 159 | 159 | ||
| 160 | <option><script language="JavaScript"> | 160 | <option><script language="JavaScript"> |
| 161 | var today = new Date( ) | 161 | var today = new Date( ) |
| ... | @@ -219,7 +219,7 @@ | ... | @@ -219,7 +219,7 @@ |
| 219 | <div class="form-group"> | 219 | <div class="form-group"> |
| 220 | <label class="col-md-4 control-label"></label> | 220 | <label class="col-md-4 control-label"></label> |
| 221 | <div class="col-md-4"> | 221 | <div class="col-md-4"> |
| 222 | - <button type="submit" class="btn btn-warning" >예약하기 <span class="glyphicon glyphicon-send "></span></button> | 222 | + <button type="submit" class="btn btn-default btn-lg" >예약하기 <span class="glyphicon glyphicon-send "></span></button> |
| 223 | </div> | 223 | </div> |
| 224 | 224 | ||
| 225 | </div> | 225 | </div> |
| ... | @@ -228,7 +228,9 @@ | ... | @@ -228,7 +228,9 @@ |
| 228 | </form> | 228 | </form> |
| 229 | </div> | 229 | </div> |
| 230 | </div> | 230 | </div> |
| 231 | +</script> | ||
| 231 | 232 | ||
| 233 | +<script type="text/javascript" src="/mail"></script> | ||
| 232 | 234 | ||
| 233 | <script> | 235 | <script> |
| 234 | function onWriteSubmit() | 236 | function onWriteSubmit() |
| ... | @@ -280,6 +282,14 @@ | ... | @@ -280,6 +282,14 @@ |
| 280 | alert(message); | 282 | alert(message); |
| 281 | return false; | 283 | return false; |
| 282 | } | 284 | } |
| 285 | + if ( $("#date").val().trim() == "" ) | ||
| 286 | + { | ||
| 287 | + var message = "예약 날짜를 입력해 주세요"; | ||
| 288 | + $("#date").val(""); | ||
| 289 | + $("#date").focus(); | ||
| 290 | + alert(message); | ||
| 291 | + return false; | ||
| 292 | + } | ||
| 283 | if ( $("#content").val().trim() == "" ) | 293 | if ( $("#content").val().trim() == "" ) |
| 284 | { | 294 | { |
| 285 | var message = "비고사항을 입력해 주세요"; | 295 | var message = "비고사항을 입력해 주세요"; | ... | ... |
| 1 | <!DOCTYPE html> | 1 | <!DOCTYPE html> |
| 2 | +<html lang="en"> | ||
| 2 | 3 | ||
| 3 | -<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> | 4 | + <head> |
| 4 | -<link rel="stylesheet" type="text/css" href="stylesheets/style.css"> | 5 | + <meta charset="utf-8"> |
| 5 | -<html> | 6 | + |
| 6 | - <div class="container"> | 7 | + <!-- Bootstrap core CSS --> |
| 7 | - <head> | 8 | + <link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet"> |
| 8 | - <title></title> | 9 | + |
| 9 | - </head> | 10 | + <!-- Custom fonts for this template --> |
| 10 | - <body> | 11 | + <link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"> |
| 11 | - <h1>예약이 확인되었습니다!</h1> | 12 | + <link href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic" rel="stylesheet" type="text/css"> |
| 12 | - <button onclick="goBack()" class="btn btn-primary" style='color: black; background-color:rgb( 200, 200, 200);'>뒤로가기</button> | 13 | + <link href='https://fonts.googleapis.com/css?family=Cabin:700' rel='stylesheet' type='text/css'> |
| 14 | + | ||
| 15 | + <!-- Custom styles for this template --> | ||
| 16 | + <link href="css/grayscale.min.css" rel="stylesheet"> | ||
| 17 | + | ||
| 18 | + <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script> | ||
| 19 | + <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script> | ||
| 20 | + | ||
| 21 | + <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> | ||
| 22 | + <link rel="stylesheet" href="https://jqueryui.com/resources/demos/style.css"> | ||
| 23 | + <script src="https://code.jquery.com/jquery-1.12.4.js"></script> | ||
| 24 | + <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> | ||
| 25 | + | ||
| 26 | + <title>식당 예약</title> | ||
| 27 | + | ||
| 28 | + <style type="text/css"> | ||
| 29 | + .reservationTheme{ | ||
| 30 | + background:url('/img/res2.jpg') no-repeat; | ||
| 31 | + } | ||
| 32 | + </style> | ||
| 33 | + <section id="about" class="reservationTheme content-section "> | ||
| 34 | + <div class="container"> | ||
| 35 | + <br><br> | ||
| 36 | + <h2>Thank you!</h2> | ||
| 37 | + <h5>예약이 성공적으로 완료되었습니다</h5> | ||
| 38 | + | ||
| 39 | + <div class="form-group"> | ||
| 40 | + <label class="col-md-4 control-label"></label> | ||
| 41 | + <div class="col-md-4 center"> | ||
| 42 | + <a href="/first" class="btn btn-default btn-lg">홈으로</a> | ||
| 43 | + </div> | ||
| 13 | <script type="text/javascript" src="/mail"></script> | 44 | <script type="text/javascript" src="/mail"></script> |
| 14 | - </body> | 45 | + </head> |
| 15 | - </div> | ||
| 16 | </html> | 46 | </html> |
| 47 | + | ||
| 48 | + | ||
| 49 | + | ||
| 50 | + | ||
| 51 | + | ||
| 52 | + <!-- <form method="POST" action="/jj"> | ... | ... |
views/reservation.ejs
deleted
100644 → 0
| 1 | -<script src="https://s.codepen.io/assets/libs/modernizr.js" type="text/javascript"></script> | ||
| 2 | -<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js" type="text/javascript"></script> | ||
| 3 | -<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js" type="text/javascript"></script> | ||
| 4 | -<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-validator/0.4.5/js/bootstrapvalidator.min.js" type="text/javascript"></script> | ||
| 5 | - | ||
| 6 | -<script src="https://code.jquery.com/jquery-1.12.4.js"></script> | ||
| 7 | -<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> | ||
| 8 | - | ||
| 9 | -<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> | ||
| 10 | -<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css" rel="stylesheet"> | ||
| 11 | -<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.0/css/bootstrapValidator.min.css" rel="stylesheet"> | ||
| 12 | - | ||
| 13 | -<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> | ||
| 14 | -<link rel="stylesheet" href="http://resources/demos/style.css"> | ||
| 15 | - | ||
| 16 | - | ||
| 17 | -<div class="container"> | ||
| 18 | - <br><br> | ||
| 19 | - <label class="col-md-4 control-label"><legend>예약하기</legend></label> | ||
| 20 | - <br><br> | ||
| 21 | -<form class="well form-horizontal" action=" " method="post" id="contact_form"> | ||
| 22 | -<fieldset> | ||
| 23 | - | ||
| 24 | - <form method="POST" action="/res"> | ||
| 25 | - <!-- Form Name --> | ||
| 26 | - | ||
| 27 | -<!-- 이름--> | ||
| 28 | -<div class="form-group"> | ||
| 29 | - <label class="col-md-4 control-label" br>이름</label> | ||
| 30 | - <div class="col-md-4 inputGroupContainer"> | ||
| 31 | - <div class="input-group"> | ||
| 32 | - <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span> | ||
| 33 | - <input name="creater_id" placeholder="이름" class="form-control" type="text"> | ||
| 34 | - </div> | ||
| 35 | - </div> | ||
| 36 | -</div> | ||
| 37 | - | ||
| 38 | - | ||
| 39 | -<!-- 휴대전화--> | ||
| 40 | -<div class="form-group"> | ||
| 41 | - <label class="col-md-4 control-label">휴대전화</label> | ||
| 42 | - <div class="col-md-4 inputGroupContainer"> | ||
| 43 | - <div class="input-group"> | ||
| 44 | - <span class="input-group-addon"><i class="glyphicon glyphicon-earphone"></i></span> | ||
| 45 | - <input name="phone" placeholder="010-123-4567" class="form-control" type="text"> | ||
| 46 | - </div> | ||
| 47 | - </div> | ||
| 48 | -</div> | ||
| 49 | - | ||
| 50 | - | ||
| 51 | - | ||
| 52 | -<!-- Text input--> | ||
| 53 | -<div class="form-group"> | ||
| 54 | - <label class="col-md-4 control-label">예약확인 받을 이메일 주소</label> | ||
| 55 | - <div class="col-md-4 inputGroupContainer"> | ||
| 56 | - <div class="input-group"> | ||
| 57 | - <span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span> | ||
| 58 | - <input name="email" placeholder="E-Mail Address" class="form-control" type="text"> | ||
| 59 | - </div> | ||
| 60 | - </div> | ||
| 61 | -</div> | ||
| 62 | - | ||
| 63 | -<!--인원수--> | ||
| 64 | -<div class="form-group"> | ||
| 65 | - <label class="col-md-4 control-label">인원 수</label> | ||
| 66 | - <div class="col-md-4 selectContainer"> | ||
| 67 | - <div class="input-group"> | ||
| 68 | - <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span> | ||
| 69 | - <select name="num" class="form-control selectpicker" > | ||
| 70 | - <option value=" " >인원 수를 선택하세요.</option> | ||
| 71 | - <option>1~4명</option> | ||
| 72 | - <option>5~10명</option> | ||
| 73 | - <option >10명~15명</option> | ||
| 74 | - <option >15명~20명</option> | ||
| 75 | - <option >20명 이상</option> | ||
| 76 | - </select> | ||
| 77 | - </div> | ||
| 78 | -</div> | ||
| 79 | -</div> | ||
| 80 | - | ||
| 81 | -<!--예약시간--> | ||
| 82 | -<div class="form-group"> | ||
| 83 | - <label class="col-md-4 control-label">예약 시간</label> | ||
| 84 | - <div class="col-md-4 selectContainer"> | ||
| 85 | - <div class="input-group"> | ||
| 86 | - <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span> | ||
| 87 | - <select name="restime" class="form-control selectpicker" > | ||
| 88 | - <option value=" " >시간을 선택하세요.</option> | ||
| 89 | - <option>10시</option> | ||
| 90 | - <option>11시</option> | ||
| 91 | - <option>12시</option> | ||
| 92 | - <option>13시</option> | ||
| 93 | - <option>14시</option> | ||
| 94 | - <option>15시</option> | ||
| 95 | - <option>16시</option> | ||
| 96 | - <option>17시</option> | ||
| 97 | - <option>18시</option> | ||
| 98 | - <option>19시</option> | ||
| 99 | - <option>20시</option> | ||
| 100 | - </select> | ||
| 101 | - | ||
| 102 | - <select name="resmin" class="form-control selectpicker" > | ||
| 103 | - <option value=" " >분을 선택하세요.</option> | ||
| 104 | - <option>00분</option> | ||
| 105 | - <option>15분</option> | ||
| 106 | - <option>30분</option> | ||
| 107 | - <option>45분</option> | ||
| 108 | - </select> | ||
| 109 | - </div> | ||
| 110 | -</div> | ||
| 111 | -</div> | ||
| 112 | - | ||
| 113 | -<!--예약날짜--> | ||
| 114 | -<div class="form-group"> | ||
| 115 | - <label class="col-md-4 control-label">예약 날짜</label> | ||
| 116 | - <input type="text" placeholder = "클릭하여 달력 보기" id="datepicker"></p></p> | ||
| 117 | - <script> | ||
| 118 | - $( function() { | ||
| 119 | - $( "#datepicker" ).datepicker(); | ||
| 120 | - } ); | ||
| 121 | - </script> | ||
| 122 | - </label> | ||
| 123 | - <br><br><br><br><br><br><br><br><br><br> | ||
| 124 | -</div> | ||
| 125 | -<!-- radio checks | ||
| 126 | - <div class="form-group"> | ||
| 127 | - <label class="col-md-4 control-label">Do you have hosting?</label> | ||
| 128 | - <div class="col-md-4"> | ||
| 129 | - <div class="radio"> | ||
| 130 | - <label> | ||
| 131 | - <input type="radio" name="hosting" value="yes" /> Yes | ||
| 132 | - </label> | ||
| 133 | - </div> | ||
| 134 | - <div class="radio"> | ||
| 135 | - <label> | ||
| 136 | - <input type="radio" name="hosting" value="no" /> No | ||
| 137 | - </label> | ||
| 138 | - </div> | ||
| 139 | - </div> | ||
| 140 | - </div> | ||
| 141 | - --> | ||
| 142 | -<!-- Text area --> | ||
| 143 | - | ||
| 144 | -<div class="form-group"> | ||
| 145 | - <label class="col-md-4 control-label">요청사항</label> | ||
| 146 | - <div class="col-md-4 inputGroupContainer"> | ||
| 147 | - <div class="input-group"> | ||
| 148 | - <span class="input-group-addon"><i class="glyphicon glyphicon-pencil"></i></span> | ||
| 149 | - <textarea class="form-control" name="content" placeholder="Project Description" style="width:310px; height:100px;"></textarea> | ||
| 150 | - </div> | ||
| 151 | - </div> | ||
| 152 | -</div> | ||
| 153 | -<br> | ||
| 154 | -<br> | ||
| 155 | -<br> | ||
| 156 | -<!-- Success message --> | ||
| 157 | -<div class="alert alert-success" role="alert" id="success_message"> <i class="glyphicon glyphicon-thumbs-up"></i> 예약해주셔서 감사합니다.</div> | ||
| 158 | - | ||
| 159 | -<!-- Button --> | ||
| 160 | -<div class="form-group"> | ||
| 161 | - <label class="col-md-4 control-label"></label> | ||
| 162 | - <div class="col-md-4"> | ||
| 163 | - <button type="submit" class="btn btn-warning" >예약 <span class="glyphicon glyphicon-send"></span></button> | ||
| 164 | - </div> | ||
| 165 | - | ||
| 166 | -</div> | ||
| 167 | - </form> | ||
| 168 | -</fieldset> | ||
| 169 | -</form> | ||
| 170 | -</div> | ||
| 171 | - </div> | ||
| 172 | - | ||
| 173 | - | ||
| 174 | - <script> | ||
| 175 | - function onWriteSubmit() | ||
| 176 | - { | ||
| 177 | - if ( $("#creater_id").val().trim() == "" ) | ||
| 178 | - { | ||
| 179 | - var message = "아이디를 입력해 주세요"; | ||
| 180 | - $("#creater_id").val(""); | ||
| 181 | - $("#creater_id").focus(); | ||
| 182 | - alert(message); | ||
| 183 | - return false; | ||
| 184 | - } | ||
| 185 | - | ||
| 186 | - if ( $("#phone").val().trim() == "" ) | ||
| 187 | - { | ||
| 188 | - var message = "폰번호를 입력해 주세요"; | ||
| 189 | - $("#phone").val(""); | ||
| 190 | - $("#phone").focus(); | ||
| 191 | - alert(message); | ||
| 192 | - return false; | ||
| 193 | - } | ||
| 194 | - if ( $("#email").val().trim() == "" ) | ||
| 195 | - { | ||
| 196 | - var message = "이메일 주소를 입력해 주세요"; | ||
| 197 | - $("#email").val(""); | ||
| 198 | - $("#email").focus(); | ||
| 199 | - alert(message); | ||
| 200 | - return false; | ||
| 201 | - }if ( $("#num").val().trim() == "" ) | ||
| 202 | - { | ||
| 203 | - var message = "인원수를 입력해 주세요"; | ||
| 204 | - $("#num").val(""); | ||
| 205 | - $("#num").focus(); | ||
| 206 | - alert(message); | ||
| 207 | - return false; | ||
| 208 | - }if ( $("#restime").val().trim() == "" ) | ||
| 209 | - { | ||
| 210 | - var message = "예약시간을 입력해 주세요"; | ||
| 211 | - $("#restime").val(""); | ||
| 212 | - $("#restime").focus(); | ||
| 213 | - alert(message); | ||
| 214 | - return false; | ||
| 215 | - } | ||
| 216 | - if ( $("#resmin").val().trim() == "" ) | ||
| 217 | - { | ||
| 218 | - var message = "예약 분을 입력해 주세요"; | ||
| 219 | - $("#resmin").val(""); | ||
| 220 | - $("#resmin").focus(); | ||
| 221 | - alert(message); | ||
| 222 | - return false; | ||
| 223 | - } | ||
| 224 | - if ( $("#content").val().trim() == "" ) | ||
| 225 | - { | ||
| 226 | - var message = "비고사항을 입력해 주세요"; | ||
| 227 | - $("#content").val(""); | ||
| 228 | - $("#content").focus(); | ||
| 229 | - alert(message); | ||
| 230 | - return false; | ||
| 231 | - } | ||
| 232 | - | ||
| 233 | - | ||
| 234 | - } | ||
| 235 | - </script> | ||
| 236 | - <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> | ||
| 237 | - <!-- 모든 컴파일된 플러그인을 포함합니다 (아래), 원하지 않는다면 필요한 각각의 파일을 포함하세요 --> | ||
| 238 | - <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script> |
-
Please register or login to post a comment