목차
[Python] Flask, Jinja2 데이터 출력하기
앞서 포스트에서는 if문을 사용해서 jinja2를 실행하였습니다.
[Python] Flask와 Jinja2 사용하여 데이터 주고 받기
목차 [Python] Flask와 Jinja2 사용하여 데이터 주고 받기 앞서 Post 글을 통해서 웹페이지(HTML)에서 백엔드(Back end) 서버로 값을 보낼 때 GET, POST 와 같은 request를 이용해서 값을 전달하였습니다...
scribblinganything.tistory.com
이번에는 jinja2를 사용해서 form으로 받은 id, pw 값을 다른 페이지에서 테이블로 출력하는 예제를 실행하겠습니다. 테이블은 bootstrap을 사용해서 꾸밀 생각 입니다.
[Python] Flask, Jinja2 데이터 출력하기 : 예제
입력과 출력을 처리할 2개의 html을 templates 폴더에 넣습니다.
코드 - login.html>>
<!DOCTYPE html>
<html lang="en">
<head>
<title>scribblinganything.tistory.com</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div class="container-sm">
<form action = "http://localhost:9999/login" method = "post">
<input type="text" class="form-control " id="id" placeholder="id" name="id">
<label for="아이디">아이디</label>
<input type="text" class="form-control" id="pw" placeholder="pw" name="pw">
<label for="pw">비밀번호</label>
<button type="submit" class="btn btn-primary" style="float:right;" id="login">로그인</button>
</form>
</div>
</body>
</html>
7~8번 라인 : bootstrap을 링크를 통해 불러 옵니다.
12번 라인 : 부트스트랩 클래스 container-sm을 사용해서 윈도우 크기에 맞춰 조절합니다.
13번 라인 : method는 Post로 전달하는 form을 만듭니다.
코드- result>>
<!DOCTYPE html>
<html lang="en">
<head>
<title>scribblinganything.tistory.com</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<table class="table">
<thead>
<tr>
<th scope="col">Key</th>
<th scope="col">Value</th>
</tr>
</thead>
{% for key, value in info.items() %}
<tr>
<th scope="row"> {{ key }} </th>
<td> {{ value }} </td>
</tr>
{% endfor %}
</table>
</body>
</html>
결과를 출력하는 html 문서입니다.
11번 라인 : 부트스트랩의 클래스 table을 사용합니다.
14~15번 라인 : 테이블의 윗 행을 scope = col로 꾸며 줍니다.
18~23번 라인 : jinja2 for문을 사용해서 info의 값을 하나씩 불러 옵니다. 여기서 info는 item으로 dictionary 형태로 불러 올 수 있습니다.
코드 - python>>
from flask import Flask, request, render_template
app = Flask(__name__)
@app.route('/login',methods = ['POST', 'GET'])
def login():
if request.method == 'POST':
info = request.form
return render_template("result.html",info=info)
else:
return render_template("login.html")
if __name__ == '__main__':
app.run(debug = True, port=9999)
결과>>
'파이썬(Python) > Flask' 카테고리의 다른 글
| [Python] Flask Redirect, Abort 함수 사용방법, HTTP 상태코드 보내기 예제(Status Code) (0) | 2021.11.25 |
|---|---|
| [Python] 세션(Session)이란? flask에서 구현해보기(jinja2사용) (0) | 2021.11.24 |
| [Python] Flask와 Jinja2 사용하여 데이터 주고 받기 (0) | 2021.11.19 |
| [Python] flask form 값 받기 (GET, POST) (0) | 2021.11.17 |
| [Python] flask 주소 간에 이동 방법 (redirect, url_for) (2) | 2021.11.14 |