Сохранение в базу данных при обновлении поля Notes в html-таблице (django)

Я нашел много ответов на этот вопрос на SO, но мое понимание всего этого все еще слишком новое, чтобы понять, как реализовать, поэтому просто размещаю свой точный вопрос:

У меня есть таблица, которая является фильтрованным представлением моей базы данных, которая отображается на одной странице моего приложения. В ней есть столбец заметок, где каждая ячейка использует content-id-editable. Я хочу добавить кнопку сохранения, и когда кто-то захочет сохранить эту конкретную ячейку раздела заметок, я хочу, чтобы он мог нажать "сохранить" и обновленная ячейка была отправлена в базу данных.

Вот мой views.py:

def notes(request):
    try:
        if request.method == 'POST':
            note = request.POST['tm.Notes']
            updated_note = TM.Object.save(Notes__=note)

            return render(request,'homepage/detail.html', {'Notes': updated_note})
        else:
            return render(request,'homepage/detail.html', {})
    except TM.DoesNotExist:
        raise Http404("Info Does Not Exist")

Вот мой html:

<table class= "content-table">
                    <thead>
                        <tr>
                            <th>Name</th>
                            <th>Distributor</th>
                            <th>State</th>
                            <th>Brand</th>
                            <th>Cell</th>
                            <th>Email</th>
                            <th>Notes</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                        {% for tm in territory_manager %}
                            <td style="white-space:nowrap;">{{ tm.Name }}</td>
                            <td style="white-space:nowrap;">{{ tm.Distributor }}</td>
                            <td style="white-space:nowrap;">{{ tm.State }}</td>
                            <td style="white-space:nowrap;">{{ tm.Brand }}</td>
                            <td style="white-space:nowrap;">{{ tm.Cell }}</td>
                            <td style="white-space:nowrap;">{{ tm.Email }}</td>
                            <td style="white-space:wrap;" input type="submit" class="primary" value="Submit" ><div contenteditable>{{ tm.Notes }}</div></td>
                        </tr>
                        {% endfor %}
                        </tr>
                        {% else %}
                        <h2>No Results for: {{ state }} </h2>
                        {% endif %}
                        </tbody>
                </table>

Я знаю, что это ужасно неправильно, и кажется, что должно быть очень простое решение, но чем больше я пытаюсь применить что-то из SO, тем больше запутываюсь. Любая помощь приветствуется. Спасибо!

Я бы не рекомендовал устанавливать его таким образом, поскольку страница будет обновляться каждый раз, когда кто-то сохраняет заметку...

Почему бы вам не отправить данные POST через AJAX?

Вам нужно написать функцию JavaScript, которую вы сможете вызывать при нажатии на кнопку.

Вы можете сделать что-то простое, например...

Notes.js

function saveNoteAjax() {
    return $.ajax({
        type: 'POST',
        url: 'your route to the function notes function in views.py',
        data: {note: document.getElementById('yourNotesInput_ID').value}
    })
}

async function SaveLoadNote(){
   await saveNoteAjax()
   *use another Ajax call to get the new notes from the DB*
   *insert some function to refresh the notes on-screen*
}

views.py

def notes(request):
   if request.is_ajax():
      note = request.POST['note']
      *insert your code for updating your DB table*
      return HttpResponse('')

Если вам не нужен AJAX, вы можете превратить всю таблицу в Django model formset. Каждое поле для заметок будет элементом ввода. Чтобы начать, {{form.notes}}. Когда все заработает, вы можете изменить свой html для рендеринга и стилизовать поле формы так, как вам захочется). Доступ к другим нередактируемым полям будет осуществляться с помощью {{form.instance.fieldname}}

Разница будет заключаться в том, что пользователь должен будет явно обновить информацию после внесения изменений, т.е. вам нужна кнопка Update для отправки изменений

Формсеты и модельные наборы форм выглядят сложными для начала, но на самом деле это не так, как только вы сделаете несколько наборов форм!

Вернуться на верх