본문 바로가기
Web/Django

[Web] django로 Todolist 만들기 for Mac - 3

by skwkiix 2023. 7. 28.
728x90

텍스트가 서버에 전송되게 하기

1) 서버로 전송

(1) HTML 수정

  • action 태그는 서버로 데이터를 전달할 때 전달할 Url 을 지정한다.
  • POST 태그를 사용할 경우 {% csrf_token %} 을 적어야 한다.
<form action="./createTodo/" method="POST">{% csrf_token %}

form안에 있는 데이터가 `./createTodo/ 라는 url로 전달됨

 

(2) Urls.py 설정

  • ToDoList > ToDoList > urls.py
    • 기본 url은 my_to_do_app 폴더에 있는 urls.py 로 처리를 넘김
from django.contrib import admin
from django.urls import path, include
​
urlpatterns = [
   path('', include('my_to_do_app.urls')), 
   path("admin/", admin.site.urls),
]
  • ToDoList > my_to_do_app > urls.py
from django.urls import path 
from . import views 
​
urlpatterns = [
   path('', views.index), 
   path('createTodo', views.createTodo) #추가
]

(3) views.py 설정

from django.shortcuts import render
from django.http import HttpResponse
​
# Create your views here.
# before
'''
def index(request):
  return HttpResponse("My_to_do_app first page")
'''
​
# after
def index(request):
   return render(request, "my_to_do_app/index.html")
​
def createTodo(request):
   return HttpResponse("create Todo를 할 거야! => ")

(4) 확인

  • 문자를 띄움

 문자열을 받아서 데이터가 전송되도록 하기

1) HTML 확인

  • name="todoContent"
    • name 태그를 이용해서 input 태그의 문자열 받아오기
<div class="content">
           <div class="messageDiv">
               <form action="./createTodo/" method="POST">{% csrf_token %}
                   <div class="input-group">
                       <input id="todoContent" name="todoContent" type="text" class="form-control" placeholder="메모할 내용을 적어주세요">
                       <span class="input-group-btn">
                           <button class="btn btn-default" type="submit">메모하기!</button>
                       </span>
                   </div>
               </form>
           </div>

2) views.py 설정

  • user_input_str = request.POST['todoContent']
def createTodo(request):
   user_input_str = request.POST['todoContent']
   return HttpResponse("create Todo를 할 거야! => " + user_input_str)

 

입력한 문자열 DB에 저장

(1) views.py 설정

  • from .models import*
    • views.py 파일과 같은 위치의 models.py 의 모든 것을 가져온다는 뜻
  • new_todo = Todo(content = user_input_str) new_todo.save()
    • 모델을 통해 새로운 데이터 생성(models.py의 Todo)
    • content : 사용자 입력값 넣어줌
    • save : DB에 저장
from django.shortcuts import render
from django.http import HttpResponse
from .models import * #추가
​
# Create your views here.
# before
'''
def index(request):
  return HttpResponse("My_to_do_app first page")
'''
​
# after
def index(request):
   return render(request, "my_to_do_app/index.html")
​
def createTodo(request):
   user_input_str = request.POST['todoContent']
   new_todo = Todo(content = user_input_str) #추가
   new_todo.save() #추가
   return HttpResponse("create Todo를 할 거야! => " + user_input_str)

2) 쿼리 확인

  • runserver 구동

이어지는 다음 포스팅은 텍스트를 작성 후에 메인페이지로 돌아가는 코드를 구현하는 과정부터 다룬다.