Django -用Bootstrap Modal在更新表单中填充数据

Question

我正在创建一个具有2个模型的简单应用程序。单位,请注意。在Note模型中，有一个带有外键(单位)的字段。现在我试图用Bootstrap Modal编辑单元的详细视图(不是详细视图)内的每个笔记。我不知道如何获得note_id，以便我可以将它用于Note的表单实例。现在，我只得到一个空表单，如果我保存它，它会用空数据覆盖原始数据。

这是一个代码。我真的很感谢你的帮助，因为我已经被这个问题困扰了很长时间了。

models.py

class Unit(models.Model):
id = models.UUIDField(primary_key=True, default=uuid.uuid4, editable=False)
number = models.CharField(max_length=10)
def __str__(self):
return self.number
class Meta:
ordering = ('number',)
def get_absolute_url(self):
return reverse("unit-detail", args=[str(self.id)])

class Note(models.Model):
id = models.UUIDField(primary_key=True, default=uuid.uuid4, editable=False)
unit = models.ForeignKey(Unit, on_delete=models.CASCADE, related_name="notes")
title = models.CharField(max_length=30)
note = models.TextField()
created_date = models.DateField()
def __str__(self):
return self.title

views.py

def unit_detail(request, pk):
unit = Unit.objects.prefetch_related('notes').get(id=pk)
# How do I pass instance for note_form ???
note_form = NoteModelForm(instance=???)
context = {
"unit":unit,
"note_form":note_form,
}
return render(request, "units/unit_detail.html", context)
# Update note
class NoteUpdateView(generic.UpdateView):
template_name = "units/note_update.html"
form_class = NoteModelForm
def get_queryset(self):
queryset = Note.objects.all()
return queryset
def get_success_url(self):
unit_id = self.object.unit.id
return reverse("unit-detail", kwargs={'pk' : unit_id})

urls . py

urlpatterns = [
path('admin/', admin.site.urls),
path("__reload__/", include("django_browser_reload.urls")),
path('', UnitListView.as_view(), name="home"),
# Unit
path('unit/<uuid:pk>/detail', unit_detail, name="unit-detail"),
# Note
path('note/<uuid:pk>/update', NoteUpdateView.as_view(), name="note-update"),
]

forms.py

class DateInput(forms.DateInput):
input_type = 'date'

class UnitModelForm(forms.ModelForm):
class Meta:
model = Unit
fields = (
'number',
)

class NoteModelForm(forms.ModelForm):
class Meta:
model = Note
fields = (
'unit',
'title',
'note',
'created_date'
)
# Custom widgets
widgets = {
'created_date': DateInput(),
}

和模板unit_detail.html

{% extends "base.html" %}
{% block content %}
<div class="card" style="width: 48rem;">
<div class="card-body">
<h5 class="card-title">{{ unit.number }}</h5>
<h6 class="card-subtitle mb-2 text-muted" id="unit-id">{{ unit.id }}</h6>
<p class="card-text">Note:</p>
{% for note in unit.notes.all %}
<!-- Include templates -->
{% include 'units/note_update.html' %}
<table>
<tbody>
<th scope="row">{{ note.title }}</th>
<td>{{ note.unit }}</td>
<td>{{ note.note }}</td>
<td>{{ note.created_date }}</td>
<td id="note-id">{{ note.id }}</td>
<td><a data-bs-toggle="modal" data-bs-target="#exampleModal{{ note.id }}" class="card-link"
type="button" id="note-edit-btn">Edit</a>
<a href="#" class="card-link">Delete</a>
</td>
</tbody>
</table>
{% endfor %}
</div>
</div>

note_update.html

{% load crispy_forms_tags %}
<!-- Modal -->
<div class="modal fade" id="exampleModal{{ note.id }}" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form method="POST" action="{% url 'note-update' note.pk %}">
<!-- Security token -->
{% csrf_token %}

<div class="modal-body">
{{ note_form|crispy }}                  
</div>

<div class="modal-footer">
<button type="reset" class="btn btn-outline-secondary">Reset</button>
<button type="submit" class="btn btn-primary">Update</button>
</div>
</form>
</div>
</div>
</div>

Answer 1

如果您想获得ID或其他内容，您可以使用request.GET.get('note_id', '')。