<form class="flex mt-4" action="/todo/api/tasks/" method="POST">
  {% csrf_token %}
  <input class="shadow appearance-none border rounded w-full py-2 px-3 mr-4 text-gray-darker"
         type="text"
         name="title"
         maxlength="100"
         required
         placeholder="Add Todo"
  >
  <input type="hidden" name="list_title" value="{{ list.title }}">

  <input
    type="submit"
    value="Add"
    hx-post="/todo/api/tasks/"
    hx-trigger="submit"
    hx-target="#parent-div"
    hx-swap="outerHTML"
    class="flex-no-shrink p-2 border-2 rounded text-blue-500 border-blue-500 hover:text-white hover:bg-blue-500"
  >
</form>
