Notice
Recent Posts
Recent Comments
Link
«   2025/01   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Tags more
Archives
Today
Total
관리 메뉴

Storage Gonie

17. (app1) Django 데이터를 입력받는 form 만들기(form 형태만 만듬) 본문

웹개발/Django 웹서비스 개발(인프런)

17. (app1) Django 데이터를 입력받는 form 만들기(form 형태만 만듬)

Storage Gonie 2019. 2. 9. 21:14
반응형

html에서 직접 태그를 이용해 만드는게 아니라, 모델, 폼 클래스들을 이용해서 만든다.

여기서는 눈에 보여지는 폼을 작성하는 것에서 끝나며 결과를 반영하는 로직은 다음 강의에서 나옴


1. lotto 폴더 밑에 form.py 파일을 생성한다.

- 완전히 비어이쓴 파일이므로 아래와 같이 작성해준다.

from django import forms

from .models import GuessNumbers     # GuessNumbers의 입력받을 폼을 만드는 것이므로

class PostForm(forms.ModelForm):     # 폼을 만들 때 forms.ModelForm을 상속받는건 일반적이다.
    class Meta:
        model = GuessNumbers         # 어떤 모델에 대한 입력 form을 만들래?
        fields = ('name', 'text',)   # 그중에 어떤 속성을 입력받을래?


2. views.py에서 post이름을 가지는 메소드를 추가해준다.

def post(request):
    form = PostForm()
    return render(request, "lotto/form.html", {"form" : form})


3. templates/lotto/ 의 위치에 form.html 파일을 생성한다.

- 주요한 부분은 form태그 사이 부분이고 csrf token은 보안이슈 때문에 넣어준 것이다.

- form.as_p에서 form은 views.py에서 넘겨받는 form객체이고 as_p는 <p>태그로 감싸서 출력한다는 의미를 가짐

- form.as_p 대신 그냥 form만 둔다면 정보입력 칸이 가로로 생긴다.

<form method="POST" class="post-form">
    {%csrf_token%}
    {{form.as_p}}
    <button type="submit" class="save btn btn-default">Save</button>
</form>
<!DOCTYPE html>
{% load staticfiles %}
<html lang="ko">
 <head>
  <title>My Little Lotto</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
  <link href="//fonts.googleapis.com/css?family=Space+Mono" rel="stylesheet">
  <link rel="stylesheet" href="{% static 'css/lotto.css' %}">
 </head>
 <body>
  <div class="page-header">
   <h1>My Little New Lotto</h1>
  </div>
  <div class="container lotto">
   <form method="POST" class="post-form">
       {%csrf_token%}
       {{form.as_p}}
       <button type="submit" class="save btn btn-default">Save</button>
   </form>
  </div>
 </body>
</html>


반응형
저작자표시 비영리

'웹개발 > Django 웹서비스 개발(인프런)' 카테고리의 다른 글

19. (app1) 앱 다듬기(버튼을 이용한 리다이렉트, 클릭한 객체의 정보를 이용해 렌더링)  (0) 2019.02.12
18. (app1) POST 처리(form에서 버튼 클릭시 DB에 반영시키기)  (0) 2019.02.09
16. (app1) Django MTV연동하기  (0) 2019.02.09
15. (app1) Django Shell을 이용한 관리(Shell을 통한 DB 읽기/쓰기/수정)  (0) 2019.02.09
14. (app1) Django Views와 템플릿 연동(MTV 중 Template과 View을 조작)  (0) 2019.02.08
'웹개발/Django 웹서비스 개발(인프런)' Related Articles more
Comments