[Django]_ToDoList 만들기 (4) 입력한 메모 출력하기

 

텍스트를 서버로 전송하기

 

지금은 웹 페이지에 메모를 입력해도 보내지는 데가 없습니다. 이러한 작업은 <action>태그의 역할입니다. 사용자의 요청 방식은 post와 get이렇게 두 가지 방식이 있습니다. 

먼저 사용자가 텍스트를 입력하고 버튼을 눌렀을 때, 해당 텍스트가 서버에 전송되도록 수정하겠습니다.

• ToDoList > my_to_do_app > templates > my_to_do_app > index.html (우리가 작업했던 파일) 로 이동합니다.
• 44번째 줄 <form>태그가 보이시나요? 

    <form>태그의 역할은 html에서 서버로 데이터를 전달하는 것입니다.  위 44~ 51번째 줄이 바로 아래 화면의 보라색 네모 상자 안의 모습으로 구현이 됩니다.

 

• <action>에 적어주는 경로로 데이터가 전달됩니다. 44번줄을 다음과 같이 수정합니다. 이렇게 수정을 하면, form안의 데이터가 createTodo라는 url로 전달된다는 것입니다. 

• 이제 url를 설정 해 줄 차례입니다. ToDoList > my_to_do_app > urls.py 로 이동합니다. 다음과 같이 path를 추가합니다.

• 이제 어디로 가야할까요? 위 8번째 줄의 의미는 저 url은 views의 createTodo에서 처리하라는 의미입니다. 그렇습니다. ToDoList > my_to_do_app > views.py 로 이동하고 다음과 같이 코드를 추가합니다.

• 다시 ToDoList > my_to_do_app > templates > my_to_do_app > index.html 로 이동합니다. 46번째 줄에 todoContent라는 말이 보입니다. request에서 해당 name인 todoContent를 이용하여 해당 <input>태그 안에 있는 문자열을 받아올 수 있습니다. 
• 다시 ToDoList > my_to_do_app > views.py로 이동하여 다음과 같이 수정합니다.

• 웹 페이지를 다시 실행시켜 봅시다.

    메모하기를 누르면 

여러분, 우리가 지금까지 작업한 각 코드의 결과물이 보이시나요? 

정말 멋지게 해내고 있습니다. 

 

이 포스팅을 끝내기 전에 한 가지 팁을 말씀드리겠습니다.

우리가 작업을 잘 하고 있는지 확인할 때 쓰기 좋은 것입니다. 왜냐하면 django에서는 에러가 나도 그 위치를 하나하나 확인하며 찾아 봐야 하기 때문입니다. 따라서 중간중간 print()를 이용하면 됩니다.

 

ToDoList > my_to_do_app > views.py에서 우리가 입력한 것을 아래와 같이 한 줄 추가해보겠습니다.

def createTodo(request):
    user_input_str = request.POST['todoContent']
    print("todoContent: " + user_input_str)
    return HttpResponse("create ToDo를 하자 ==>" + user_input_str)

이렇게 우리의 결과물을 터미널에서 확인할 수 있습니다. print가 잘 되었다는 것은 앞선 작업까지는 오류 없다는 뜻입니다.

 

웹 사이트에 입력한 내용은 user_input_str에 저장한다고 보면 되고, 아직 우리는 데이터베이스와는 연동하지 않았습니다. 만약 연동한다면 입력한 메모는 데이터베이스에 저장이 되는 것입니다. 

 

우리는 다음 포스팅에서 사용자가 입력한 데이터들을 데이터베이스에 저장하고, 저장한 내용을 사용자에게 보여주는 작업을 하도록 하겠습니다. 오늘도 감사합니다.