YUYANE

Django / form 본문

Framework/DJANGO

Django / form

YUYA 2021. 1. 19. 13:48

Form

다음 두 가지 사항에 대한 확인이 필요하다.

1) 유저의 입력값이 담긴 데이터를 반환 할 url

2) 데이터가 반환 될 HTTP 메서드

 

 

 

1. HTTP(Hypertext Transfer Protocol)

 

- 클라이언트와 서버 간 통신을 가능하게 해줌

- 클라이언트가 요청을 전달하면, 서버가 응답한다.

 

 

2. GET & POST

 

이러한 요청/응답 절차에 가장 많이 사용되는 방법으로 각각의 용도가 다르다.

 

1) GET 

  - 전달 받은 데이터를 string으로 집어 넣어 URL을 작성하는데 사용한다. 이 URL은 데이터, 데이터 키, 데이터 값이

    보내져야 할 주소를 포함한다.

  - 보안에 민감한 데이터(비밀번호 등)에는 사용하면 안 된다.

 

2) POST 

  - 브라우저거 폼 데이터를 모아 암호화 시킨 후 서버로 보낸다.

  - 장고의 CSRF 보호와 결합할 수 있으므로 GET 보다는 접근에 대한 통제가 가능하다.

    (장고에서는 CSRF 토큰 사용이 필수)

 

 

3. 장고의 역할

 

1) 데이터를 준비하여 재 구축 함으로써 렌더링 준비

2) 데이터를 위한 HTML 폼 생성

3) 클라이언트로부터 전달 받은 폼과 데이터를 가공

 

 

4. The Django Form class(간단한 구현 예시)

 

from django import forms

class Sign_up(forms.Form):
    name = forms.CharField()
    email = forms.EmailField()
    text = forms.CharField(widget=forms.Textarea)

 

위 코드는 세 개의 필드(name, email, text)을 가진 Form 클래스를 정의한다.

 

  <body>
    <div class="container">
      <form method="POST">
          {{form.as_p}}
          {% csrf_token %}
          <input type="submit" class="btn btn-primary" value="Submit">
      </form>
    </div>
  </body>

 

연결 된 템플릿에서 body 부분을 위와 같이 정의 해주면 아래와 같은 화면이 완성 된다.

 

 

유저가 'submit' 버튼을 누르면, 데이터의 유효성을 체크한 뒤에 데이터를 가져오면 된다.

 

form.is_valid()

데이터의 유효성을 확인해 주는 함수로, 유효할 경우에 'true' 를 리턴한다.

 

form.cleaned_data()

검증에 성공한 값들은 dict 타입으로 제공한다.

 

 

 

5. ModelForm Class

 

forms 클래스를 상속받아, 모델 형태의 폼 데이터를 저장할 수 있다.

백문이 불여일견!

 

1) models.py

from django.db import models

# Create your models here.
class User(models.Model):
    first_name = models.CharField(max_length=128)
    last_name = models.CharField(max_length=128)
    email = models.EmailField(max_length=264, unique=True)

 

User라는 모델 안에 세 가지 필드(first_name, last_name, email)가 있다.

 

2) forms.py

from django import forms
from appTwo.models import User

class NewUserForm(forms.ModelForm):
    class Meta:
        model = User
        fields = '__all__'

폼 클래스 안에 User을 모델 값으로 넣어주고, 필드에 모든 값을 넣어준다. 

 

3) users.html

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Users</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
  </head>
  <body>
    <div class="container">
      <div class="jumbotron">
          <h1>Please sign up here! </h1>
          <form method="post">
            {{ form.as_p }}
            {% csrf_token %}
            <input type="submit" class='btn btn-primary' value="submit">
          </form>
      </div>
    </div>
=
  </body>
</html>

 

폼을 보여 줄 html 코드를 작성하고, 화면을 확인하면 아래와 같이 모든 필드(First name, Last name, Email)가 폼에 들어가있다.

 

 

4) views.py

 

유저가 'submit'을 클릭하면, 전송 된 데이터가 유효한 값인지 확인한다.

확인 되었다면, 저장한다.

 

def users(request):
    form = NewUserForm()

    #POST를 받는 지 확인
    if request.method == 'POST':
        form = NewUserForm(request.POST)

        # 유효한 폼인지 확인
        if form.is_valid():
           #저장
            form.save(commit=True)
            return index(request)
        else:
            print('Error Form Invalid')


    return render(request,'appTwo/users.html',{'form':form})

 

5) 저장 된 모습

 

 

참고

 

www.udemy.com/course/python-and-django-full-stack-web-developer-bootcamp/learn/lecture/6637752#announcementswww.udemy.com/course/python-and-django-full-stack-web-developer-bootcamp/

 

docs.djangoproject.com/en/3.1/topics/forms/

 

 

 

** 잘못 된 부분이 있다면 댓글로 알려주시면 감사하겠습니다!

Comments