Django 模板中的实时表单字段计算

Question

我正在创建一个股票市场网站，并希望在用户键入时实时显示总购买价值，而不是在表单清理期间显示错误。该计算涉及将两个字段相乘。第一个是数量字段，它只是用户输入的数字。第二个是股票，它是外键的下拉列表。用户选择一只股票，该股票的一个属性是价格。我想将这些字段相乘并在用户每次更改字段时显示结果。如果可能的话，我也想用模型表格来做到这一点。我尝试在模板中使用 {{ form.field.value }} 来获取一个字段，但我无法让它更新以进行更改。对于股票字段，我认为最好的选择是在 JavaScript 中创建一个匹配的数组，一旦我可以获得实时更新的表单值，就可以将其与数组中的股票价格相匹配。这是一个不是我制作的示例，它接近我想做的基于表单输入的实时 Javascript 计算任何帮助深表感谢！Models.pyclass Stock(models.Model):    name = models.CharField(max_length=30, primary_key=True, blank=True)    @property    def price():         do some calculationsclass Transaction(models.Model):    transaction_types = (        ('buy', 'Buy'),        ('sell', 'Sell'),    )    user = models.ForeignKey(User, on_delete=models.CASCADE)    stock = models.ForeignKey(Stock, on_delete=models.CASCADE)    transaction_type = models.CharField(max_length=4, choices=transaction_types)    quantity = models.BigIntegerField()    purchase_price = models.DecimalField(decimal_places=2, max_digits=30)    time = models.DateTimeField()Forms.pyclass TransactionForm(forms.ModelForm):class Meta:    model = Transaction    fields = ['transaction_type', 'stock', 'quantity']    widgets = {        'quantity': forms.NumberInput(attrs={'id': 'quant', 'name': 'quant'})    }

Answer 1

我想出了如何做到这一点。基本上，我使用 Django Rest Framework 制作了一个 api。从那里，我使用 Vue 将我的表单制作为 v 模型。每次 v-model 发生变化时，我都会使用 watch 来调用 api。