У меня сейчас есть базовое приложение Django, которое позволяет пользователям добавлять элементы в базу данных. Когда продукт добавлен, список элементов должен обновляться при добавлении нового элемента через форму, и отображать этот продукт и все другие продукты, уже имеющиеся в базе данных. Вот код, который у меня есть:
Это файл views.py
с моей текущей реализацией метода, который должен получить продукты внизу:
from django.shortcuts import render
from django.views.decorators.csrf import csrf_exempt
from products.models import Product
from django.http import HttpResponse, JsonResponse
def index(request):
return render(request, 'index.html')
@csrf_exempt
def createProduct(request):
if request.method == 'POST':
name = request.POST.get('name')
description = request.POST.get('description')
price = request.POST.get('price')
newProduct = Product(
name = name,
description = description,
price = price
)
newProduct.save()
return HttpResponse('')
def viewProduct(request):
if request.method == 'GET':
ProductList = Product.objects.all()
products=[]
for Product in ProductList:
products.append({"name": Product.name, "description": Product.description, "price": Product.price})
return JsonResponse(products)
Страница index.html
:
<!DOCTYPE html>
<html>
<body>
<div>
<h2 id="title">Create product</h2>
<input id="name">Name</input>
<br>
<input id="description">Description</input>
<br>
<input id="price">Price</input>
<br>
<button id="add-product">ADD PRODUCT</button>
</div>
<div id="productList">
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
document.getElementById('add-product').onclick = function(){
sendData();
getData();
}
function sendData(){
var order = {
name: document.getElementById('name').value,
description: document.getElementById('description').value,
price: document.getElementById('price').value
};
$.ajax({
type: "POST",
url: 'create/product',
data: order,
success: function(newProduct){
console.log("success"),
$('#name').val(""),
$('#description').val(""),
$('#price').val("")
}
});
};
function getData(){
$.ajax({
url: 'view/product',
dataType: 'json',
type: 'GET',
success: function(data){
$.each(data.Product, function(index, element){
$('body').append($('productList', {
text: element.name
}));
});
}
});
}
</script>
</html>
И файл urls.py
:
from django.contrib import admin
from django.urls import path
from products import views
urlpatterns = [
path('admin/', admin.site.urls),
path('', views.index),
path('create/product', views.createProduct),
path('view/product', views.viewProduct)
]
Пока что добавление продукта в порядке и проблем не вызывает. Однако после написания метода getData()
и его включения эта часть не работает и возвращает следующую ошибку:
File "C:\Users\install\Documents\tutorial\products\views.py", line 29, in viewProduct
ProductList = Product.objects.all()
UnboundLocalError: local variable 'Product' referenced before assignment
Меня смущает эта ошибка, так как я нигде не назначаю Product в этом файле, поэтому не уверен, почему он возвращает эту ошибку. Когда я делаю то же самое назначение в командной консоли, у него нет проблем с ним, и он возвращает все объекты. Может кто-нибудь помочь мне решить это? Спасибо.