Question

我有一个产品和销售模型。产品包含产品名称，价格和数量的列表，其中销售模型具有产品（外键），数量和价格。有一个销售表格，显示产品清单，数量和价格。每当用户选择产品时，价格字段应显示该产品的价格以及哪个应该是不可编辑的。怎么办呢？

我的代码

产品

class Product(models.Model):
    name = models.CharField(max_length=120, blank=True, null=True, help_text="name of the product")
    quantity = models.PositiveIntegerField(default=1)
    price =  models.DecimalField(max_digits=10,decimal_places=2)

    def __str__(self):
        return self.name

产品/ forms.py

PRODUCT_QUANTITY_CHOICES = [(i, str(i)) for i in range(1, 21)]

class ProductForm(forms.ModelForm):
    class Meta:
        model = Product
        fields = '__all__'

产品/ views.py

def add_product(request):
    if request.method=='POST':
        form = ProductForm(request.POST or None)
        if form.is_valid():
            # product = form.save(commit=false)
            # product.save()
            name = form.cleaned_data['name']
            price = form.cleaned_data['price']
            quantity = form.cleaned_data['quantity']
            Product.objects.create(name=name, quantity=quantity, price=price)
            messages.success(request, 'Product is successfully added.')
            return redirect('/product/')
    else:
        form = ProductForm()
    return render(request, 'product/product_add.html', {'form':form})

销售/ models.py

class Sale(models.Model):
    product = models.ForeignKey(Product)
    quantity = models.PositiveIntegerField(default=1)
    price =  models.DecimalField(max_digits=10,decimal_places=2)

    def __str__(self):
        return self.product.name

销售/ forms.py

class SaleForm(forms.ModelForm):
    class Meta:
        model = Sale
        fields = '__all__'

在图片（销售表格）中，我选择了产品鞋，其价格为70美元，现在选择产品鞋后，我的价格框内应该显示70美元。同样，如果我选择产品足球，价格框应显示足球价格。

更新

销售/ urls.py

url(r'^price/(?P<pk>\d+)$', views.fetch_price, name='fetch_price'),

ajax的sales / views.py

def add_sale(request):
    if request.method=='POST':
        form = SaleForm(request.POST or None)
        form.fields['price'].widget.attrs['disabled']=True
        if form.is_valid():
            # product = form.save(commit=false)
            # product.save()
            product = form.cleaned_data['product']
            price = form.cleaned_data['price']
            quantity = form.cleaned_data['quantity']
            Sale.objects.create(product=product, quantity=quantity, price=price)
            messages.success(request, 'Product is successfully sold.')
            return redirect('/product/')
    else:
        form = SaleForm()
    return render(request, 'sale/add_sale.html', {'form':form})


def fetch_price(request, pk):
    product = get_object_or_404(Product, pk=pk)
    print('product',product)
    if request.method=='GET':
        response = HttpResponse('')
        price = product.price
        print('price',price)
        response['price-pk'] = product.pk
        response['price'] = price 
        return response

add_sale.html

<script>
        $('#id_product').on('change', function() {
            price_value = $(this).val();
            console.log(price_value);
            $.ajax({
                type:'GET',
                url:'/sale/price/'+price_value+"/",
                success: function(data){
                    console.log('price will be updated based on product selected');
                    $('#id_price').val(data.price);
                }
            })
        });
    </script>

这样我就得到了404错误

Answer 1

尝试此操作以禁用表单字段。

form = SaleForm()
form.fields['price'].widget.attrs['disabled'] = True

这只是在前端禁用它。您必须在后端表单验证中进行验证，因为在前端，任何人都可以禁用启用。

Answer 2

您应该编写javascript代码来检测onchange字段的product事件。在onchange事件处理程序中，您应该通过传递product_id来激活对后端的AJAX调用以获取所选产品的信息。通常，这是从urls.py调用的另一个视图函数。一旦后端响应，AJAX调用的回调应该更新price字段。您可以考虑使用jQuery代替普通javascript来简化实施。

Answer 3

不行！

这会导致对服务器的大量请求只显示产品价格！

始终尽量减少请求以提高网站性能的最佳做法。

现在回答您关于获取价格的问题：

在您的 html 中，在产品 for 循环中，添加特殊标签以在选项中显示产品价格..

例如：

         {% for item in products %}
          <select class="products">
                <option price="{{ item.price }}">
                      {{ item.name }}
                </option>
           </select>
          {% endfor %}

现在最后一步是使用Javascript根据选择呈现产品价格！

    $(document).on("change", '.products', function (event) {
           event.preventDefault();
           $('#id_price').val($(this).children(":selected").attr("price"));
    });

在向服务器执行任何ajax/请求之前，请始终考虑是否可以通过免费的SQL查询方法来完成。

根据表格框

3 个答案: