[英]Multiply two fields in django form and populate third filed with the result
我正在我的 django 應用程序中創建一個表單,如下所示:
視圖.py
@method_decorator([login_required, client_required], name='dispatch')
class MaterialRequestFormView(CreateView):
model = MaterialRequest
template_name = 'packsapp/client/materialRequestForm.html'
fields = "__all__"
def form_valid (self, form):
product = form.save(commit=False)
product.save()
messages.success(self.request, 'The material request was created with success!')
return redirect('client:mat_req_table')
模型.py
class MaterialRequest(models.Model):
owner = models.ForeignKey(Client, on_delete=models.CASCADE, related_name='allotment_sales')
flow = models.ForeignKey(Flow, on_delete=models.CASCADE, related_name='flow')
kit = models.ForeignKey(Kit, on_delete=models.CASCADE, related_name='kit')
quantity = models.IntegerField(default=0)
is_allocated = models.BooleanField(default=False)
quantity_p1 = models.IntegerField(default=0)
quantity_p2 = models.IntegerField(default=0)
quantity_p3 = models.IntegerField(default=0)
quantity_p4 = models.IntegerField(default=0)
quantity_p5 = models.IntegerField(default=0)
html
<h2>Material Request Form</h2>
<div class="row">
<div class="col-md-6 col-sm-8 col-12">
<form method="post" id="MaterialRequestForm" data-kit-url="{% url 'employee:ajax_load_kit' %}"
data-product-url="{% url 'employee:ajax_load_product' %}"
novalidate>
{% csrf_token %}
{{ form|crispy }}
<button type="submit">Save</button>
</form>
</div>
</div>
<div id="products-table">
</div>
<script>
$("#id_flow").change(function () {
console.log("function running");
var url = $("#MaterialRequestForm").attr("data-kit-url");
var flowId = $(this).val();
$.ajax({
url: url,
data: {
'flow': flowId
},
success: function (data) {
$("#id_kit").html(data);
console.log(data);
}
});
});
</script>
<script>
$("#id_kit").change(function () {
console.log("function running");
var url = $("#MaterialRequestForm").attr("data-product-url");
var kitId = $(this).val();
$.ajax({
url: url,
data: {
'kit': kitId
},
success: function (data) {
$("#products-table").html(data);
}
});
});
</script>
ajax是拿表的。
我可以更改它,以便當我輸入數量時,它將表中的std quantity
乘以該值並將其填充到相應的列中?
圖片以獲得更好的說明:
該表是通過以下方式創建的:
<tbody>
{% for product in products %}
<tr>
<td>{{ product.id }}</td>
<td>{{ product.product_name }}</td>
{% for i in quantities %}
{% if forloop.counter == forloop.parentloop.counter %}
<td id="q1">{{ i }}</td>
{% endif %}
{% endfor %}
{% endfor %}
</tr>
</tbody>
為了簡化:將Quantity
與Std Qty
相乘並填充Quantity p1
看起來您想在數據提交之前在客戶端執行此操作。 正如您可能懷疑的那樣,最好使用javascript
來完成。 由於您已經在使用jquery
,我建議您查看change
處理程序: https://api.jquery.com/change/
您將使用raw data
監聽元素的變化,然后計算新值並填充動態值。 上面的文檔有幾個例子。
那么如何找出元素的 ID 呢? 在瀏覽器中使用開發人員 web 工具(通常, right click > inspect element
)。 通常,只要您不更改字段名稱,這不會更改,但如果您願意,它們也可以重寫。 只需創建一個實際的表單(或模型表單)。
一切順利!
您可以通過使用 jquery 輕松做到這一點。 為 forms.py 中的字段提供 id,
例如,#std 是 std 的 id,#quantity 是數量字段。
$('#quantity').change(function(){
std = $('#std').val();
quantity = $('#quantity').val();
x = parseInt(std) * parseInt(quantity);
// Now assign x to your respective field
});
因此動態值將被更改,然后您可以使用 django 表單或其他方式簡單地保存它。
希望這可以幫助!
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.