【发布时间】:2021-08-03 09:21:28
【问题描述】:
我们已经完成了一个使用 Bootstrap Modals 创建前端管理仪表板的项目。
当我们从 ASP 模式更新记录时,我们使用 JSON 输出和 JQuery 来填充表单中的数据,因为我们发现这不能仅由 Django 完成。
我们遇到的问题是我们可以使用填充的 JSON 数据添加新记录,但我无法编辑现有记录。即使 JQUERY 和 JSON 在我们点击提交时带来了正确的数据,它也无法关联到数据库中的记录。
我们如何更新正确的记录?
我们尝试的另一种方法是通过 URL 传递 ID(与预订相关),但这会一直重定向页面而不是停留在模式上。
我就不多说了,下面是问题的相关代码。
我不擅长编程,所以希望这对我们正在努力实现的目标有所帮助,在此先感谢我们在此问题上可以获得的任何帮助。
查看代码
class admin_booking(View):
def get(self, request):
# check whether the user is logged in.
context = initialize_context(request)
token = get_token(request)
session = request.session
if session.get('user') == None:
return redirect('vistours:signin')
# get the model data.
asp_data = ASPBookings.objects.all()
bfbw_data = BFBWBookings.objects.all()
tour_data = SchoolTourBookings.objects.all()
ath_data = Athlete.objects.all()
# add the model data to a context dictionary
context = {
'asp_bookings': asp_data,
'bfbw_bookings': bfbw_data,
'tour_bookings': tour_data,
'ath_data':ath_data,
'ath_form': AthleteForm(),
'asp_form': ASPBookingsForm(),
}
# Serialise the data to JSON output file.
with open("vistours/static/vistours/json/asp.json", "w") as out:
json_serializer = serializers.get_serializer('json')()
json_serializer.serialize(asp_data, stream=out, indent=4)
with open("vistours/static/vistours/json/bfbw.json", "w") as out:
json_serializer = serializers.get_serializer('json')()
json_serializer.serialize(bfbw_data, stream=out, indent=4)
with open("vistours/static/vistours/json/tours.json", "w") as out:
json_serializer = serializers.get_serializer('json')()
json_serializer.serialize(tour_data, stream=out, indent=4)
return render(request, 'vistours/admin_bookings.html', context)
# post athlete data Modal.
def post(self, request):
if request.method == 'POST':
form = AthleteForm(request.POST)
print(request.POST)
if form.is_valid():
form.save()
else:
print(form.errors)
form()
return redirect('vistours:admin_booking')
# Update ASP Modal.
def post(self, request, id):
if request.method == 'POST':
asp_id = request.POST.get('booking_ref')
asp_data = ASPBookings.objects.filter(id=id)
print(asp_id)
print(asp_data)
form = ASPBookingsForm(request.POST)
form.save()
else:
print(form.errors)
return redirect('vistours:admin_booking')
网址
path('admin_bookings/all/', views.admin_booking.as_view(), name='admin_booking'),
path('admin_bookings/confirmed/', views.admin_booking_confirmed.as_view(), name='admin_booking_confirmed'),
path('admin_bookings/tbc/', views.admin_booking_tbc.as_view(), name='admin_booking_tbc'),
path('admin_bookings/completed/', views.admin_booking_completed.as_view(), name='admin_booking_completed'),
path('admin_bookings/cancelled/', views.admin_booking_cancelled.as_view(), name='admin_booking_cancelled'),
型号
class ASPBookings(models.Model):
# Select/Choice field value lookups ('Database', 'HTML').
presentation_form_options = (
('Face to Face', 'Face to Face'),
('Virtual', 'Virtual'),
)
organisation_types = (
('Government School', 'Government School'),
('Community Organisation', 'Community Organisation'),
('Non-Government School', 'Non-Government School'),
('Other', 'Other')
)
regions = (
('Metro', 'Metro'),
('Regional', 'Regional')
)
statuses = (
('TBC', 'TBC'),
('Confirmed', 'Confirmed'),
('Completed', 'Completed'),
('Cancelled', 'Cancelled')
)
booking_times = [
('0900', '0900'),
('0915', '0930'),
('0930', '0900'),
('0945', '0945'),
('1000', '1000'),
('1015', '1030'),
('1030', '1000'),
('1045', '1045'),
('1100', '1100'),
('1115', '1130'),
('1130', '1100'),
('1145', '1145'),
('1200', '1200'),
('1215', '1230'),
('1230', '1200'),
('1245', '1245'),
('1300', '1300'),
('1315', '1330'),
('1330', '1300'),
('1345', '1345'),
('1400', '1400'),
('1415', '1430'),
('1430', '1400'),
('1445', '1445'),
('1500', '1500'),
]
durations = [
('0.5', '0.5'),
('1.0', '1.0'),
('1.5', '1.5'),
('2.0', '2.0'),
('2.5', '2.5'),
('3.0', '3.0'),
]
booking_ref = models.CharField(max_length=10, default=1)
program_type = models.CharField(max_length=120)
booking_date = models.DateField()
booking_time = models.CharField(max_length=10, choices=booking_times, default='0700')
duration = models.CharField(max_length=10, choices=durations, default='0.5')
street = models.CharField(max_length=120)
suburb = models.CharField(max_length=120)
region = models.CharField(max_length=120, choices=regions, default='Metro')
post_code = models.CharField(max_length=40)
organisation_type = models.CharField(max_length=120,choices=organisation_types, default='Government School')
audience_number = models.CharField(max_length=10)
presentation_form = models.CharField(max_length=120, choices=presentation_form_options, default='Face to Face')
contact_name = models.CharField(max_length=80)
email = models.EmailField()
phone_number = models.CharField(max_length=120)
comments = models.TextField()
status = models.CharField(max_length=80, choices=statuses, default='TBC')
athlete = models.ForeignKey(Athlete, default= '1', on_delete=models.CASCADE)
def __str__(self):
return self.contact_name
# return URL after the POST has been submitted.
def get_absolute_url(self):
return reverse('success')
表格
class ASPBookingsForm(forms.ModelForm):
class Meta():
model = ASPBookings
# Inclusion / Exclusion of fields within the Form view.
fields = '__all__'
exclude = ['athlete', 'status']
# Widgets add Bootstrap and CCS classes to Django inputs.
widgets = {
'booking_ref': TextInput(attrs={'id':'asp_booking_ref', 'name': 'asp_booking_ref'}),
'program_type': TextInput(attrs={'id': 'asp_prev_program', 'name': 'prev_program'}),
'booking_date': TextInput(attrs={'type':'date', 'class': 'form-control', 'id': 'asp_prev_date', 'name': 'prev_date'}),
'booking_time': Select(attrs={'class':'form-select','id': 'asp_prev_time', 'name': 'prev_time'}),
'duration': Select(attrs={'class': 'form-select','id': 'asp_prev_duration', 'name': 'prev_duration'}),
'street': TextInput(attrs={'class': 'form-control', 'id': 'asp_street', 'name': 'street', 'placeholder': 'Flinders Street'}),
'suburb': TextInput(attrs={'class': 'form-control', 'id': 'asp_suburb', 'name': 'suburb', 'placeholder': 'Albert Park'}),
'post_code': NumberInput(attrs={'class': 'form-control', 'id': 'asp_postcode', 'name': 'postcode', 'placeholder': '3000'}),
'region': Select(attrs={'class': 'form-select', 'id': 'asp_region', 'asp_name': 'region', 'placeholder': 'region'}),
'organisation_type': Select(attrs={'class': 'form-select', 'id': 'asp_org_type', 'name': 'org_type', 'placeholder': 'Organisation Type'}),
'audience_number': TextInput(attrs={'class': 'form-control', 'id': 'asp_audience_number', 'name': 'audience', 'placeholder': '0-999'}),
'presentation_form': Select(attrs={'class': 'form-select', 'id': 'asp_presentation_form', 'name': 'presentation_form'}),
'contact_name': TextInput(attrs={'class': 'form-control', 'id': 'asp_contact_name', 'name': 'contact_name', 'placeholder': 'John Doe'}),
'email': TextInput(attrs={'class': 'form-control', 'id': 'asp_email', 'name': 'email', 'placeholder': 'name@example.com'}),
'phone_number': TextInput(attrs={'class': 'form-control', 'id': 'asp_phone', 'name': 'phone', 'placeholder': '0400 000 000', 'pattern': '^((\+61\s?)?(\((0|02|03|04|07|08)\))?)?\s?\d{1,4}\s?\d{1,4}\s?\d{0,4}$'}),
'comments': Textarea(attrs={'class': 'form-control', 'id': 'asp_comments', 'name': 'comments'}),
}
HTML
<tbody>
{% for booking in asp_bookings %}
<tr>
<td>{{booking.id}}</td>
<td>{{booking.program_type}}</td>
<td>{{booking.booking_date}}</td>
<td>{{booking.booking_time}}</td>
<td>{{booking.duration}}</td>
<td>{{booking.organisation_type}}</td>
<td>{{booking.contact_name}}</td>
<td>
<p class="table_tag">{{booking.athlete.athlete_name}}</p>
<a href="#">
<i data-bs-toggle="modal" data-bs-target="#assign_athlete_modal" class="fa fa-user-times table_icons mx-1">
</i>
</a>
</td>
<td>
{% if booking.status == "TBC"%}
<span class="badge rounded-pill bg-success table_tag">{{booking.status}}</span>
{% elif booking.status == "Confirmed"%}
<span class="badge rounded-pill bg-primary table_tag">{{booking.status}}</span>
{% elif booking.status == "Cancelled"%}
<span class="badge rounded-pill bg-danger table_tag">{{booking.status}}</span>
{% else %}
<span class="badge rounded-pill bg-secondary table_tag">{{booking.status}}</span>
{% endif %}
{% if booking.program_type == "asp" %}
<a href="#"><i data-bs-toggle="modal" data-bs-target="#edit_asp_modal" class="fa fa-pencil table_icons mx-1" data-vis-ref="{{booking.id}}" data-vis-program="{{booking.program_type}}"></i></a>
{% elif booking.program_type == "bfbw" %}
<a href="#"><i data-bs-toggle="modal" data-bs-target="#edit_bfbw_modal" class="fa fa-pencil table_icons mx-1" data-vis-ref="{{booking.id}}" data-vis-program="{{booking.program_type}}"></i></a>
{% elif booking.program_type == "tours" %}
<a href="#"><i data-bs-toggle="modal" data-bs-target="#edit_tours_modal" class="fa fa-pencil table_icons mx-1" data-vis-ref="{{booking.id}}" data-vis-program="{{booking.program_type}}"></i></a>
{% endif %}
{% if booking.status == "Confirmed" %}
<a class="fa-disabled-admin-icons" href="{% url 'vistours:asp_confirm_booking' id=booking.id %}"><i class="fa fa fa-check table_icons mx-1"></i></a>
<a href="{% url 'vistours:asp_cancel_booking' id=booking.id %}"><i class="fa fa-trash table_icons mx-1"></i></a>
{% elif booking.status == "Cancelled" %}
<a href="{% url 'vistours:asp_confirm_booking' id=booking.id %}"><i class="fa fa fa-check table_icons mx-1"></i></a>
<a class="fa-disabled-admin-icons" href="{% url 'vistours:asp_cancel_booking' id=booking.id %}"><i class="fa fa-trash table_icons mx-1"></i></a>
{% elif booking.status == "Completed" %}
<a class="fa-disabled-admin-icons" href="{% url 'vistours:asp_confirm_booking' id=booking.id %}"><i class="fa fa fa-check table_icons mx-1"></i></a>
<a href="{% url 'vistours:asp_cancel_booking' id=booking.id %}"><i class="fa fa-trash table_icons mx-1"></i></a>
{% else %}
<a href="{% url 'vistours:asp_confirm_booking' id=booking.id %}"><i class="fa fa fa-check table_icons mx-1"></i></a>
<a href="{% url 'vistours:asp_cancel_booking' id=booking.id %}"><i class="fa fa-trash table_icons mx-1"></i></a>
{% endif %}
</td>
<!-- EDIT ASP Modal -->
<form method="post" id="edit_asp_form">
{% csrf_token %}
{{ form.non_field_errors }}
{{ form.source.errors }}
{{ form.source }}
<div class="modal fade" id="edit_asp_modal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header card-header">
<h5 class="modal-title"><i class="fa fa-pencil mx-1"></i> Edit ASP Booking Details</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="card text-dark bg-light mb-3">
<div class="card-body">
<div class="form-floating mb-3">
{{asp_form.street}}
<!-- <input type="text" required class="form-control" id="asp_edit_street" name="asp_edit_street" placeholder="Flinders Street"> -->
<label for="asp_edit_street">Street</label>
</div>
<div class="form-floating mb-3">
{{asp_form.suburb}}
<!-- <input type="text" required class="form-control" id="asp_edit_suburb" name="asp_edit_suburb" placeholder="Albert Park"> -->
<label for="asp_edit_suburb">Suburb</label>
</div>
<div class="form-floating mb-3">
{{asp_form.post_code}}
<!-- <input required oninput="this.value =
!!this.value && Math.abs(this.value) >= 0 ? Math.abs(this.value) : null;if(this.value<0){this.value= this.value =0} else if(this.value>9999){this.value= this.value =9999}
" type="number" min="0" max="9999" class="form-control" name="asp_edit_postcode" id="asp_edit_postcode" placeholder="0 - 9999"> -->
<label for="asp_edit_postcode">Post Code</label>
</div>
<div class="form-floating mb-3">
{{asp_form.audience_number}}
<!-- <input required oninput="this.value =
!!this.value && Math.abs(this.value) >= 0 ? Math.abs(this.value) : null;if(this.value<0){this.value= this.value =0} else if(this.value>9999){this.value= this.value =9999}
" type="number" min="0" max="9999" class="form-control" name="asp_edit_audience_number" id="asp_edit_audience_number" placeholder="0 - 9999"> -->
<label for="asp_edit_audience_number">Audience Number</label>
</div>
<div class="form-floating mb-3">
{{asp_form.region}}
<!-- <select class="form-select" id="asp_edit_region" name="asp_edit_region">
<option value="1">Metro</option>
<option value="2" selected>Suburb</option>
</select> -->
<label for="asp_edit_region">Region</label>
</div>
<div class="form-floating mb-3">
{{asp_form.organisation_type}}
<!-- <select class="form-select" id="asp_edit_org_type" name="asp_edit_org_type">
<option value="1">Community organisation</option>
<option value="2">Corporation</option>
<option value="3" selected>Government school</option>
<option value="4">Non-Government school</option>
<option value="5">Other</option>
</select> -->
<label for="asp_edit_org_type">Organisation Type</label>
</div>
<div class="form-floating mb-3">
{{asp_form.duration}}
<!-- <select class="form-select" id="asp_edit_session_length" name="asp_edit_session_length">
<option value="1">0.5 Hr</option>
<option value="2">1.0 Hr</option>
<option value="3">1.5 Hr</option>
<option value="4">2.0 Hr</option>
<option value="5">2.5 Hr</option>
<option value="6">3.0 Hr</option>
</select> -->
<label for="asp_edit_session_length">Session Length</label>
</div>
<div class="form-floating mb-3">
{{asp_form.booking_time}}
<!-- <select class="form-select" id="asp_edit_time" name="asp_edit_time">
<option selected value="0700">07:00 AM</option>
<option value="0715">07:15 AM</option>
<option value="0730">07:30 AM</option>
<option value="0745">07:45 AM</option>
<option value="0800">08:00 AM</option>
<option value="0815">08:15 AM</option>
<option value="0830">08:30 AM</option>
<option value="0845">08:45 AM</option>
<option value="0900">09:00 AM</option>
<option value="0915">09:15 AM</option>
<option value="0930">09:30 AM</option>
<option value="0945">09:45 AM</option>
<option value="1000">10:00 AM</option>
<option value="1015">10:15 AM</option>
<option value="1030">10:30 AM</option>
<option value="1045">10:45 AM</option>
<option value="1100">11:00 AM</option>
<option value="1115">11:15 AM</option>
<option value="1130">11:30 AM</option>
<option value="1145">11:45 AM</option>
<option value="1200">12:00 Noon</option>
<option value="1215">12:15 PM</option>
<option value="1230">12:30 PM</option>
<option value="1245">12:45 PM</option>
<option value="1300">01:00 PM</option>
<option value="1315">01:15 PM</option>
<option value="1330">01:30 PM</option>
<option value="1345">01:45 PM</option>
<option value="1400">02:00 PM</option>
<option value="1415">02:15 PM</option>
<option value="1430">02:30 PM</option>
<option value="1445">02:45 PM</option>
<option value="1500">03:00 PM</option>
<option value="1515">03:15 PM</option>
<option value="1530">03:30 PM</option>
<option value="1545">03:45 PM</option>
<option value="1600">04:00 PM</option>
<option value="1615">04:15 PM</option>
<option value="1630">04:30 PM</option>
<option value="1645">04:45 PM</option>
<option value="1700">05:00 PM</option>
<option value="1715">05:15 PM</option>
<option value="1730">05:30 PM</option>
<option value="1745">05:45 PM</option>
<option value="1800">06:00 PM</option>
<option value="1815">06:15 PM</option>
<option value="1830">06:30 PM</option>
<option value="1845">06:45 PM</option>
<option value="1900">07:00 PM</option>
</select> -->
<label for="asp_edit_time">From 07:00 AM to 07:00 PM</label>
</div>
<div class="form-floating">
{{asp_form.booking_date}}
<!-- <input required type="date" class="form-control" id="asp_edit_date" name="asp_edit_date"> -->
<label for="asp_edit_date">Date</label>
</div>
</div>
</div>
<div class="card text-dark bg-light mb-3">
<div class="card-body">
<div class="form-floating mb-3">
{{asp_form.presentation_form}}
<!-- <select class="form-select" id="asp_edit_presentation_form" name="asp_edit_presentation_form">
<option value="1" selected>Face-to-Face</option>
<option value="2">Virtual</option>
</select> -->
<label for="asp_edit_presentation_form">Preferred Presentation Form</label>
</div>
<div class="form-floating mb-3">
{{asp_form.contact_name}}
<!-- <input required type="text" class="form-control" id="asp_edit_contact_name" name="asp_edit_contact_name" placeholder="John Doe"> -->
<label for="asp_edit_contact_name">Contact Name</label>
</div>
<div class="form-floating mb-3">
{{asp_form.email}}
<!-- <input required type="email" class="form-control" id="asp_edit_email" name="asp_edit_email" placeholder="name@example.com"> -->
<label for="asp_edit_email">Email</label>
</div>
<div class="form-floating mb-3">
{{asp_form.phone_number}}
<!-- <input pattern="^((\+61\s?)?(\((0|02|03|04|07|08)\))?)?\s?\d{1,4}\s?\d{1,4}\s?\d{0,4}$" required type="text" class="form-control" id="asp_edit_phone" name="asp_edit_phone" placeholder="0400 000 000"> -->
<label for="asp_edit_phone">Phone</label>
</div>
<div class="form-floating">
{{asp_form.comments}}
<!-- <textarea required class="form-control" placeholder="Leave a comment here" name="asp_edit_comments" id="asp_edit_comments" maxlength="500"></textarea> -->
<label for="asp_edit_comments">Speaker Brief</label>
</div>
</div>
</div>
</div>
{{asp_form.program_type}}
{{asp_form.booking_ref}}
<!-- <input type="text" name="asp_edit_program" id="asp_prev_program" hidden="hidden" style="visibility: hidden;"> -->
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary" name="save_edit_asp">Save Changes</button>
</div>
</div>
</div>
</div>
</form>
<!-- END EDIT ASP Modal -->
【问题讨论】:
标签: json django django-views django-forms bootstrap-modal