Я пытаюсь создать функцию JS внутри кнопки в приложении Django, которое удаляет запись связанной базы данных (SQLite3)

Question

У меня есть веб-сервер Django localhost, с которым я экспериментировал, и я использую печально известное «приложение задач» в качестве вступления к нескольким темам.

Концептуально, пользователь помещает свой «элемент задачи» в поле ввода текста (которое представляет собой форму Django внутри шаблона Django HTML). Это действие берет текст и помещает его в базу данных SQLite3, и в то же время действие создает контейнер div с тегом абзаца и кнопкой внутри этого div. Тег P заполняется содержимым текста, заданного во входных данных. Кнопка предназначена для двух вещей; во-первых, он удаляет родительский div, который удаляет эту кнопку и элемент задачи. Таким образом, это похоже на кнопку «этот элемент готов», которая удаляет этот элемент. Это работает правильно.

ВТОРАЯ функция кнопки, однако, поставила меня в тупик. Идея состоит в том, чтобы удалить этот элемент из базы данных, так как именно там я сохраняю и извлекаю элементы списка при создании страницы. Я попытался сделать это, передав переменную {item} (которая представляет собой переменную языка шаблонов Django, созданную внутри представления Django, которое я покажу ниже) в функцию удаления, которая, как я ожидаю, должна удалить связанной записи базы данных, путем фильтрации любого элемента, содержащего текст в {item}. Я знаю, что это не идеальный метод, но это моя первая попытка. Пожалуйста, не придирайтесь к этому слишком сильно. Это не предназначено для использования с клиентами, это всего лишь эксперимент, который я буду использовать.

Проблема: кнопка, которая должна удалять связанную запись базы данных, минуя переменную {item} в методе удаления фильтра для базы данных, выдает ошибки и не работает, несмотря на то, что я бесконечно возился с синтаксисом. Я явно делаю что-то не так, но я не знаю что, и ошибка chrome dev tools ДЕЙСТВИТЕЛЬНО не помогает и не имеет смысла. Буду очень признателен за любую помощь.

Код: соответствующий django раздел шаблона для страницы задачи / приложения:

    <div class="root-div container">
      <div class="app-div container">

        <div class="form-div container">
        <form method="post">
          {% csrf_token %}
          {{ form }}
          <button type="submit" class="btn">Post</button>
        </form>
      </div>

      <div class="tutorial-container container">
        <p class="container">Items will show up below.</p><hr></br>
      </div>


      <div class="todo-items-container container">
        {% for item in all_todo_items %}
          <div class="spawner container">
            <p class="item-container container">>: {{ item }}</p>
            <button class="delete-item-button btn" onclick="this.parentNode.remove();Todoitem.objects.filter(item={{ item }}).delete();">Del</button>
          </div>
        {% endfor %}

      </div>

Представление, связанное с этим приложением:

from django.shortcuts import render
from django.http import HttpResponse, HttpResponseNotFound, HttpResponseRedirect #for handling basic responses

from .forms import TodoForm
from .models import Todoitem


def todo_view(request, *args):

    all_todo_items = Todoitem.objects.all #grabbing items from the db and putting them in a variable

    if request.method == "POST": #block for when info is being pushed thru view
        form = TodoForm(request.POST)
        if form.is_valid():
            form.save() #posts to db hopefully

    form = TodoForm()

    return render(request, 'todo/base.html', context={
                                                    "form": TodoForm,
                                                     "all_todo_items": all_todo_items})

Связанная модель :

# always makemigration and migrate when models are changed
class Todoitem(models.Model):
    #the modelform will pull from this list to populate the form fields/types/elements
    item = models.CharField(max_length=200, blank=True)

    def __str__(self):
        return self.item
    # when objects are called manually, they return their strings instead because of this

Ошибка:

Когда я запускаю это приложение и тестирую его в инструментах chrome dev, я получаю вот что.

Для меня это практически не имеет смысла, и на самом деле это не дает мне очевидного источника того, в чем проблема, хотя я, очевидно, подозреваю, что это связано со встроенным JS функция, которую я пытаюсь выполнить, AKA

Todoitem.objects.filter(item={{ item }}).delete();

Опять же, я был бы очень признателен за любое понимание того, что на земле идет не так, будь то синтаксис, или я вызываю переменную в методе, который так не работает, или что-то в этом роде. Хотя, пожалуйста, имейте в виду, что я новичок в этом, и я еще не сильно использовал Javascript, и я все еще довольно новичок в DOM и продвинутых Python вещах.

Спасибо.

изменить: я использую Windows в качестве основной ОС, а веб-сервер Django работает Python 3.8.2 и Django 3.0.4. Это содержится в виртуальной среде. Все остальные части веб-сервера Django работают отлично. Тоже нормально загружается.