如何在django表单操作url中传递从下拉列表中选择的项目的id

Question

问题 在这个过程中，我想将下拉列表中事务项的id传递到表单操作URL cart_ad 从下拉列表中选择的值中，我已经获取了id，但现在我不知道如何将该id传递到脚本，然后再传递到添加到购物车的形式。如果有人知道，请帮忙

<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script>
$(document).on("change", '.Price', function (event) {
event.preventDefault();
$('#id_price').text($(this).children(":selected").attr("price"));
$('#id_sale_price').text($(this).children(":selected").attr("sale_price"));
$('#transactionIDValue').val($(this).children(":selected").attr("transID"));
});
</script>

<select class="Price" style="width: 250px;">
<option value="none" selected disabled hidden>
Select an Option
</option>
{% for item in transaction %}

<option transID={{item.id}} price={{item.Price}} sale_price={{item.get_sale}} >{{item.AUID.unit}} - {{item.Description}}</option>
{% endfor %}
</select>
<form id='transactionIDValue' action="{% url 'cart:cart_add' %}" class="d-inline" method="post">
{{cart_product_form}}
{% csrf_token %}
<input type="submit" class="btn btn-primary shadow px-5 py-2" value="Add To Cart">
<!-- <button type="submit" class="btn btn-primary shadow px-5 py-2">Add to Cart</button> -->
</form>

Answer 1

只需在脚本标记中添加操作URL，如以下检查工作片段

$(document).on("change", '.Price', function (event) {
event.preventDefault();
let id = $('#customselect').find(":selected").attr('price');
console.log('Id : ',id)
let Url = `/page/${id}`  
$('#transactionIDValue').attr('action', Url);
let formAction = $('#transactionIDValue').attr('action')
let formAction2 = $('#transactionIDValue').prop('action')
console.log('form action relative  url : ',formAction)
console.log('form action full url : ',formAction2)
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="Price" id="customselect">
<option value="">----</option>
<option value="1" price="1">1</option>
<option value="2" price="2">2</option>
<option value="3" price="3">3</option>
</select>
<form id="transactionIDValue">
</form>