Как использовать несколько bootstrap modal в одном представлении для CRUD действий в Django?
У меня есть представление с несколькими модальными и формами типа Add_image , Add_birthday и таблица для отображения всех объектов. Я хочу для каждого ROW создать кнопку и модальную форму для редактирования. Когда пользователь нажимает кнопку Edit_button, открывается модальная форма, показывающая модель объекта, и пользователь редактирует форму и сохраняет ее. Как показать специальный объект и обновить его в модале.
Я сделал именно это в приложении, которое поддерживает организацию информации о проекте.
Полагаю, что существует множество различных способов решения этой проблемы, но я выбрал путь переопределения метода post представления. Возьмем, например, код в следующем сокращенном представлении:
class HomeView(LoginRequiredMixin, PermissionRequiredMixin, TemplateView):
permission_required = 'app.view_project'
reviewtype = None
template_name = "home.html"
def post(self, request, *args, **kwargs):
""" a) There are two forms for each project accordion button
displayed by this HomeView and,
b) We are displaying those forms in a Bootstrap 5 'modal' (as
opposed to redirecting the user to a new view for the form(s))
Override the POST method for this view so that the forms can be
processed correctly.
"""
# Determine which form is being sent in the post request.
if 'owner' in request.POST:
# 'owner' was in the POST data: NoteForm was sent in
form = NoteForm(data=request.POST)
elif 'changed_by' in request.POST:
# 'changed_by' was in POST data: ReviewStatusForm was sent in
form = ReviewStatusForm(data=request.POST)
elif 'project_company_approval' in request.POST:
# 'project_company_approval' was in POST data: EditFieldForm was sent in
form = EditCompanyApprovalForm(
data=request.POST,
instance=Project.objects.get(project_number=request.POST['project_number']),
)
Вы заметите, что представление проверяет, присутствует ли поле, которое пользователь хотел отредактировать, в данных POST, и если да, оно запускает соответствующую форму и заполняет ее данными, присутствующими в форме.
Что касается самого модала, то он обрабатывается следующим шаблоном:
{% load crispy_forms_tags %}
<!-- Button trigger modal -->
<i type="button" class="bi bi-pencil-square" style="color : green" data-bs-toggle="modal" data-bs-target="#editCompanyApprovalModal{{ project.project_number }}" onclick="open_modal({{ project.project_number }},'_project_approval','{{ project.project_approval }}')" ></i>
<!-- Modal -->
<div class="modal fade" id="editCompanyApprovalModal{{ project.project_number }}" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel{{ project.project_number }}" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body">
{% crispy form %}
</div>
</div>
</div>
</div>
Надеюсь, это поможет ответить на ваш вопрос? Дайте мне знать, если есть что-то еще, что вы хотели бы увидеть, и я посмотрю, что я могу сделать, чтобы вывести это с ответом.
В зависимости от вашей конкретной реализации, возможно, вам также придется переопределить метод get_context_data() представления.
Желаю вам удачи.
когда я использую этот синтаксис "id="editCompanyApprovalModal{{ project.project_number }}"" , мой модал не работает