본문 바로가기

Projects/Flask 할일리스트

#4. 작성한 할일 삭제하기

삭제버튼을 눌렀을 때, 할일이 삭제되도록 구현한다

할일들을 작성하여 DB에 저장하고, 이것들을 다시 DB에서 꺼내와서 메인페이지에 띄워주는 작업까지 진행하였다. 이번에는 저장한 할일들을 삭제해주는 기능을 구현해야 한다. 이를 위해선 우선 삭제버튼부터 index.html에 만들어준다.

 

{% extends 'base.html' %}

<!-- 헤드부분 -->
{% block head %}
<title>Task Master</title>
{% endblock %}

<!-- 바디부분 -->
{% block body %}
<div class="content">
    <h1>도대체 무엇을 해야하나</h1>

    {% if tasks|length < 1 %}
    <h4>할 일이 없습니다. 오늘은 제발 일 좀 하세요.</h4>
    {% else %}

    <table>
        <tr>
            <th>할일</th>
            <th>저장한 시간</th>
            <th>수정/삭제</th>
        </tr>
        {% for task in tasks %}
            <tr>
                <td>{{ task.content }}</td>
                <td>{{ task.date_created.date() }}</td>
                <td>
                    <a href="/update/{{task.id}}">Update</a>
                    <br>
                    //Delete버튼을 누르면, 해당 할일을 삭제해야 한다
                    /*따라서 그냥 '/delete'가 아니라 
                    꼭 해당 할일의 ID까지 파라미터로 보내야한다 */
                    <a href="/delete/{{task.id}}">Delete</a>
                </td>
            </tr>
        {% endfor %}
    </table>
    {% endif %}

    <form action="/" method="POST">
        <input type="text" name="content" id="content">
        <input type="submit" Value="Add Task">
    </form>

</div>
{% endblock %}

삭제버튼을 눌렀을 때, 해당 할일만 삭제를 해주어야 한다. 어떻게 해야할까? 방법은 할일 자체에 붙은 id값을 이용하면 된다. 앞서서 DB를 세팅할 때, 할일 리스트마다 ID를 붙혀주었다. 마찬가지로 특정 글을 삭제할 때, 이 id를 url에 파라미터로 보내주면, 해당 글만 삭제할 수 있다. 

 

//delete url로 파라미터로서 id가 함께 들어왔을 때의 로직
@app.route('/delete/<int:id>')
def delete(id):
	
    //파라미터로 전달받은 id를 활용하여
    //DB에서 이에 해당하는 할일들 찾는다
    task_to_delete = Todo.query.get_or_404(id)


    //이후 DB에서 해당 할일을 삭제한 뒤, 
    //메인페이지로 다시 돌아온다
    try:
        db.session.delete(task_to_delete)
        db.session.commit()
        return redirect('/')
    except:
        return 'There was a problem deleting that task'

app.py에서 delete와 id가 함께 url로 들어왔을 때, 삭제처리를 한다. DB에 쿼리를 보내서 삭제를 하면 된다.