The task was given to develop a service for working with the restaurant database on django. Clicking on the corresponding buttons /fields of the data table should redirect to pages with edit/add/delete forms, but any interaction with the site redirects only to the page for adding new data. I’ve been trying to find the reason for this behavior for several hours, but nothing comes out. Below is the html markup of one of the pages, views, forms and URLs for working with one of the database tables.
<body>
{% include 'main/navbar.html' %}
<h1>restaurants</h1>
<div class="add">
<form method="post" action="{% url 'create_restaurant' %}">
{% csrf_token %}
{{ form.as_p }}
<button type="submit" class="btn btn-success">Добавить</button>
</form>
</div>
<table class="table">
<ul></ul>
<thead>
<tr>
<th>Address </th>
<th>Phone number</th>
<th>Delivery area</th>
<th>Menu</th>
<th></th>
</tr>
</thead>
<tbody>
{% for restaurant in restaurants %}
<tr data-id="{{ restaurant.id }}">
<td class="editable-field" data-field="address">{{ restaurant.address }}</td>
<td class="editable-field" data-field="phone">{{ restaurant.phone }}</td>
<td class="editable-field" data-field="district">{{ restaurant.delivery_code.district }}</td>
<td class="editable-field" data-field="menu">{{ restaurant.menu_code.name }}</td>
<td>
<button class="btn btn-danger" data-toggle="modal" data-target="#confirmDeleteModal{{ restaurant.id }}">
delete
</button>
<div class="modal" id="confirmDeleteModal{{ restaurant.id }}" tabindex="-1" role="dialog" aria-labelledby="confirmDeleteModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="confirmDeleteModalLabel">Confirmation of deletion</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
are you shure? "{{ restaurant.address }}"?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">cancel</button>
<form method="post" action="{% url 'delete_restaurant' restaurant.id %}">
{% csrf_token %}
{{ form.as_p }}
<button type="submit" class="btn btn-danger">delete</button>
</form>
</div>
</div>
</div>
</div>
</td>
</tr>
{% endfor %}
</tbody>
</table>
<div class="modal" id="editRestaurantModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Edit a restaurant</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<form id="editRestaurantForm" method="post" action="{% url 'manage_restaurant' %}">
{% csrf_token %}
{{ form.as_p }}
<input type="hidden" name="restaurant_id" value="{{ current_restaurant.id }}">
<input type="submit" value="save">
</form>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
$('.editable-field').on('click', function () {
const restaurantId = $(this).closest('tr').data('id');
const editFormUrl = `/manage_restaurant/${restaurantId}/`;
console.log('editFormUrl:', editFormUrl);
$('#editRestaurantForm').attr('action', editFormUrl);
$.get(editFormUrl, function (data) {
$('#editRestaurantModal').find('.modal-body').html(data);
});
$('#editRestaurantModal').modal('show');
});
$('#editRestaurantForm').submit(function (e) {
e.preventDefault();
const editFormUrl = $(this).attr('action');
const formData = $(this).serialize();
console.log('Form submitted!');
console.log('editFormUrl:', editFormUrl);
console.log('formData:', formData);
$.ajax({
type: 'POST',
url: editFormUrl,
data: formData,
success: function () {
$('#editRestaurantModal').modal('hide');
location.reload();
}
});
});
$('input[name="delete_option"]').on('change', function () {
const deleteOption = $(this).val();
const formAction = $(this).closest('form').attr('action');
const updatedAction = `${formAction}?delete_option=${deleteOption}`;
$(this).closest('form').attr('action', updatedAction);
});
});
</script>
</body>
views:
def restaurant_list(request):
restaurants = Restaraunts.objects.all()
return render(request, 'main/restaurant_list.html', {'restaurants': restaurants})
def manage_restaurant(request, restaurant_id=None):
if restaurant_id:
restaurant = get_object_or_404(Restaraunts, pk=restaurant_id)
form = RestaurantForm(request.POST or None, instance=restaurant)
if request.method == 'POST':
if 'delete' in request.POST:
restaurant.delete()
return redirect('restaurant_list')
elif form.is_valid():
form.save()
return redirect('restaurant_list')
else:
form = RestaurantForm()
return render(request, 'main/restaurant_list.html', {'form': form})
def create_restaurant(request):
if request.method == 'POST':
form = RestaurantForm(request.POST)
if form.is_valid():
form.save()
return redirect('restaurant_list')
else:
form = RestaurantForm()
return render(request, 'main/restaurant_list.html', {'form': form})
def delete_restaurant(request, restaurant_id):
restaurant = get_object_or_404(Restaraunts, pk=restaurant_id)
if request.method == 'POST':
form = DeleteRestaurantForm(request.POST)
if form.is_valid():
delete_option = form.cleaned_data['delete_option']
if delete_option == 'cascade':
restaurant.delete()
elif delete_option == 'set_null':
# Установите поля delivery_code и menu_code на NULL
restaurant.delivery_code = None
restaurant.menu_code = None
restaurant.save()
return redirect('restaurant_list')
else:
form = DeleteRestaurantForm()
return render(request, 'main/restaurant_list.html', {'form': form, 'restaurant': restaurant})
url-s:
path('', restaurant_list, name='restaurant_list'),
path('manage/', manage_restaurant, name='manage_restaurant'),
path('manage_restaurant/<int:restaurant_id>/', manage_restaurant, name='manage_restaurant'),
path('restaurants/manage/<int:restaurant_id>/', manage_restaurant, name='manage_restaurant'),
path('restaurants/create/', create_restaurant, name='create_restaurant'),
path('delete_restaurant/<int:restaurant_id>/', delete_restaurant, name='delete_restaurant'),
forms:
class RestaurantForm(forms.ModelForm):
class Meta:
model = Restaraunts
fields = '__all__'
class DeleteRestaurantForm(forms.Form):
DELETE_CHOICES = [
('cascade', 'Каскадное удаление'),
('set_null', 'Установить ссылки на NULL'),
]
delete_option = forms.ChoiceField(choices=DELETE_CHOICES, widget=forms.RadioSelect)
When you click on any field from the table on the site, a form for editing should open in the modal window, but a form for adding a new field opens. When deleting, a modal window appears to confirm the action, then the same form appears for adding, but it contains radiobuttons to select the type of deletion.